Declarative
React giúp tạo UI tương tác đơn giản. Thiết kế các khung nhìn đơn giản cho từng trạng thái trong ứng dụng của bạn và React sẽ cập nhật và render đúng các thành phần phù hợp khi dữ liệu của bạn thay đổi.
Các câu khai báo làm cho mã của bạn dễ sử dụng hơn và dễ tìm lỗi hơn.
Component-Based
Xây dựng các component và quản lý các trạng thái của riêng chúng, sau đó kết hợp chúng để tạo các UI phức tạp.
Vì component logic được viết bằng JavaScript thay vì các mẫu, bạn có thể dễ dàng truyền dữ liệu phong phú qua ứng dụng của mình và tránh thao tác với DOM.
Học một lần, Viết mọi nơi
Chúng tôi không đưa ra các giả định về phần kĩ năng công nghệ của bạn, vì vậy bạn có thể phát triển các tính năng mới trong React mà không cần viết lại mã hiện có.
React cũng có thể render trên máy chủ bằng Node và xây dựng ứng dụng di động bằng cách sử dụng React Native.
Ví dụ Component
Các thành phần React thực hiện một phương thức render () lấy dữ liệu đầu vào và trả về những gì sẽ hiển thị. Ví dụ này sử dụng cú pháp giống như XML có tên là JSX. Dữ liệu đầu vào được truyền vào thành phần có thể được truy cập bằng render () qua this.props.
JSX là tùy chọn và không bắt buộc phải sử dụng React. Hãy thử Babel REPL để xem mã JavaScript ban đầu được tạo bởi bước biên dịch JSX.
Đang tải code mẫu...
A Stateful Component
Ngoài việc lấy dữ liệu đầu vào (được truy cập qua this.props), một thành phần có thể duy trì dữ liệu trạng thái bên trong (được truy cập quathis.state). Khi dữ liệu trạng thái của một thành phần thay đổi, sẽ được cập nhật bằng cách gọi lại render ().
Đang tải code mẫu...
Một ứng dụng
Sử dụng props vàstate, chúng ta có thể kết hợp một ứng dụng Todo nhỏ. Ví dụ này sử dụng state để theo dõi danh sách các mục hiện tại cũng như văn bản mà người dùng đã nhập. Mặc dù các trình xử lý sự kiện được hiển thị cùng dòng, chúng sẽ được thu thập và triển khai bằng cách sử dụng các sự kiện.
Đang tải code mẫu...
Component sử dụng plugins bên ngoài
React cho phép bạn giao tiếp với các thư viện và frameworks. Ví dụ này sử dụng remarkable, một thư viện Markdown bên ngoài, để chuyển đổi giá trị của <textarea> trong thời gian thực.