React Fragment (cú pháp <React.Fragment> hoặc viết tắt <>) cho phép nhóm nhiều phần tử con lại với nhau mà không tạo thêm một thẻ DOM thừa (như <div>) bọc bên ngoài.
Khi nào nên sử dụng:
- Khi một component cần return nhiều phần tử cùng cấp.
- Khi nhóm các phần tử bên trong <dl>, <ul>, hoặc <table> (ví dụ: <tr> hoặc <li>) mà thẻ bọc ngoài sẽ làm sai cấu trúc HTML hợp lệ.
Lưu ý về cú pháp:
Cú pháp rút gọn <>...</> không hỗ trợ thuộc tính key. Nếu bạn đang lặp qua một mảng để tạo danh sách Fragment, bạn bắt buộc phải dùng cú pháp đầy đủ: <React.Fragment key={item.id}>...</React.Fragment>.