React 16.4 hỗ trợ các sự kiện của pointer

React 16.4 is out, with support for an oft-requested new feature: pointer events!

Huge thanks to @PhilippSpiess for contributing this change! https://t.co/3IAX6Zc1GN

— React (@reactjs) May 24, 2018

Pointer events là gì?

Pointer events là các sự kiện phát sinh khi người dùng tương tác với website bằng các thiết bị không phải chuột, ví dụ: bút chạm (pen/stylus), hoặc dùng tay chạm vào màn hình cảm ứng. Trong DOM, lớp PointerEvent kế thừa tất cả thuộc tính của MouseEvent, giúp cho việc hỗ trợ xử lý các sự kiện này dễ dàng hơn. Bạn có thể tìm hiểu thêm về pointer events trên trang MDN.

React 16.4 giới thiệu các sự kiện của pointer trong React DOM:

• onPointerDown
• onPointerMove
• onPointerUp
• onPointerCancel
• onGotPointerCapture
• onLostPointerCapture
• onPointerEnter
• onPointerLeave
• onPointerOver
• onPointerOut

Lưu ý: các sự kiện này chỉ được hỗ trợ trên phiên bản mới nhất của Chrome, Firefox, Edge và Internet Explorer. Safari, lại một lần nữa, đi sau thế giới. Hoặc bạn có thể sử dụng Pointer Events Polyfill.

Hành vi của getDerivedStateFromProps thay đổi

Trong phiên bản 16.3, static getDerivedStateFromProps() hoạt động giống như componentWillReceiveProps(), chỉ được kích hoạt khi props của component thay đổi. Nhưng từ phiên bản 16.4, phương thức này sẽ được gọi mỗi khi component được render lại, bất kể đó là do props hay this.setState(). Thay đổi này giúp “dọn đường” cho chế độ async render sắp tới của React 17.

Hầu hết ứng dụng sẽ không bị ảnh hưởng từ thay đổi này. Nếu có chỉ là trong những trường hợp rất hiếm, ví dụ như hàm getDerivedStateFromProps() có side effects, hoặc thay đổi giá trị của controlled value từ props. Chi tiết bạn có thể xem ở đây.

Lời khuyên là gần như 90% bạn KHÔNG CẦN DÙNG getDerivedStateFromProps, và nhóm phát triển React sẽ có bài hướng dẫn khi nào nên và không nên dùng phương thức này.

Kết

Bạn có thể nâng cấp phiên bản React trong dự án bằng cách chạy:

yarn add react@^16.4.0 react-dom@^16.4.0
npm install --save react@^16.4.0 react-dom@^16.4.0