<Header(name='React')>

<Header:name='React' />

<Header.prop name='React'>

<Header name='React' />

Từ component con lên component cha

Từ DOM vào component

Từ server xuống component

Từ component cha xuống component con

Component con sẽ tự động nhận dữ liệu mới và re-render

Component con sẽ không nhận được thay đổi

Không có gì xảy ra nếu không dùng useEffect

Component con phải gọi lại component cha

this.setState({ count: 0 }) trong constructor

Khai báo this.state = { count: 0 } bên trong constructor sau khi gọi super(props)

state = { count: 0 } ở ngoài class

Gán trực tiếp state.count = 0 trong render()

updateState()

modifyState()

changeState()

setState()

DOM thật được cập nhật thủ công bằng JavaScript

Không có gì xảy ra nếu không gọi lại render()

Bạn cần gọi forceUpdate() để thay đổi giao diện

Giao diện tự động cập nhật theo giá trị state mới

{isOnline ? "Online" "Offline"}

{isOnline then "Online" else "Offline"}

if (isOnline) { "Online" } else { "Offline" }

{isOnline ? "Online" : "Offline"}

onSubmit

onKeyPress

onInputClick

onChange

e.target.value

input.value

e.input

e.value

Có state và props

Kết hợp value và onChange

Sử dụng useEffect

Có state và propsDùng event onSubmit

Vì React chỉ cho phép truyền dữ liệu theo chiều từ dưới lên

Vì props chỉ hoạt động trong class component

Vì React dùng cơ chế one-way data flow, chỉ cho phép truyền props từ cha xuống con

Vì các component con luôn được render độc lập

Truyền props ngược từ con sang cha

Sử dụng Context API để kết nối hai component con

Dùng biến toàn cục để chia sẻ dữ liệu

Gọi hàm callback được truyền từ cha thông qua props

Trong phương thức constructor()

Trong phần import của file

Trong phần export default

Trong phương thức render()

<div>userName</div>

<div>"userName"</div>

<div>$userName</div>

<div>{userName}</div>

for (let name of names)

names.render(...)

names.foreach(...)

names.map(...)

Tăng tốc độ gọi API

Để đánh số thứ tự

Giúp React định danh phần tử khi cập nhật

Key không cần thiết

Gây lỗi và không hiển thị gì

Bắt buộc phải dùng số làm key

Tự động gán key cho mỗi phần tử

Hiển thị bình thường nhưng sẽ cảnh báo trong console