Flutter 6.3 - Constructor key ?

Constructor key:

const TransactionItem({
Key? key,
required this.transaction,
required this.deleteTx,
}) : super(key: key);

Mọi StatefulWidget trong flutter đều cần có key, Stateless có thể k cần. Trong một số trường hợp, key luôn phải có.


Ví dụ: Nếu k có key, khi xóa 1 item trong list view, Widget tree sẽ hiểu là đã xóa 1 item, nhưng element tree thì ko, nó sẽ so sánh các item cùng hạng tree, sau đó đẩy item ở vị trí số 2 lên đầu => set value của item 2 trong widget tree cho item đầu trong element tree (ko set lại màu mè,...). Sau khi set lại value widget tree sang element tree thì element tree sẽ xóa các item, state thừa của nó => xóa sai item.

Khi có key, flutter sẽ dựa vào key để xóa, update,.. item trong element tree => xóa đúng item.

Ví dụ:
const TransactionItem({
Key? key,
required this.transaction,
required this.deleteTx,
}) : super(key: key);

*Chỉ nên dùng key khi dùng ListView, StatefulWidget. Ko nên dùng nếu k cần vì nếu dùng khi k cần => giảm hiệu suất.

Nhận xét

Bài đăng phổ biến từ blog này

Flutter 4.5 - Custom theme, font, image

Flutter 1.2 - Flutter Architecture

Flutter 2.5 - First App | Building a Widget Tree