S2 - L25 - List Item Key

[ngminhtrung]

Câu hỏi: Trong phần này, Stephen Grider có nói đến lỗi trong console khi không đặt key cho component VideoListItem bên trong map(). Phần giải thích của tác giả hơi nhanh, nghe chưa hiểu mục đích của key để làm gì.

Trả lời: Tốt nhất nên đọc thêm docs của React, bài "Lists and Keys". Đại loại có mấy ý cần nhớ.

• Key giúp React nhận diện item nào bị thay đổi, hay thêm vào, hoặc bị xóa đi.
• Key đóng vai trò như chứng minh nhân dân của mỗi item, cho nên mỗi item trong số các anh cùng component cha (cùng cấp) phải có key khác nhau.
• Một khi đã sang cấp khác, hoặc cha khác, thì key lại có thể lặp lại, không cần khác biệt trên toàn bộ code.
• Việc đặt Key ở chỗ nào cũng cần phải lưu ý. Tốt nhất là có map() ở đâu thì đặt key ở đó.

Lưu ý: List ở đây thực ra là khái niệm của HTML. Đọc ở đây

[ghun131]

Em sorry nhìn lại thì cái id của mấy video đều như nhau hết.