- vừa được xem lúc

[P2] Flutter - Cở bản cho người mới nhập môn

0 0 383

Người đăng: Thanh Tú

Theo Viblo Asia

Như bài trước mình cũng đã nói sơ về StatelessWidgetStatefulWidget thì hôm nay mình sẽ nói về vòng đời (LifeCycle) của StatefulWidgetStatelessWidget và không dài dòng như phần trước mình sẽ vào thẳng chủ đề chính.

StatelessWidget

  • Như bài trước StatelessWidget là 1 Widget tĩnh không có trạng thái (State) vì thế nó sẽ không chấp nhận có sự thay đổi bên trong nên vòng đời nó khá ngắn gọn như sau:

StatefulWidget

  • Với StatefulWidget là 1 Widget động có trạng thái (State) vì thế nó sẽ chấp nhận sự thay đổi bên trong và vòng đời nó như sau:

image.png

1. createState(): Khi một StatefulWidget được tạo thì nó sẽ được gọi đầu tiên và cũng là bắt buộc. Vì sao mình lại nói bắt buộc?

image.png

  • Bạn cũng có thể thấy để sử dụng được Class _MyAppState thì với StatefulWidget bạn bắc buộc phải khởi tạo createState() cho nó.

2. mounted == true: nói nom na là nó dùng để xác định và đảm bảo trạng thái (State) tồn tại trước khi gọi setState().

3. initState(): nó sẽ là phương thức đầu tiên được gọi và chỉ gọi đúng 1 lần khi Widget được tạo.

4. didChangeDependencies(): ngay sau initState() thì đây là phương thức tiếp theo được gọi. Nó cũng sẽ được gọi bất cứ khi nào một object mà widget này phụ thuộc vào dữ liệu từ nó được gọi. Ví dụ: nếu nó dựa vào một InheritedWidget, InheritedWidget sẽ được cập nhật.

5. build(): Phương thức này được gọi để render một Widget. Bắt buộc phải @override và trả về một Widget.

6. didUpdateWidget(): nom na theo cách hiểu của mình là nó nhận biết được sự thay đổi của Widget. VD mình dùng 1 class StatefulWidget lồng trong 1 Widget:

Không dùng didUpdateWidget() Dùng didUpdateWidget()
not.gif yes.gif

Code mẫu:

Không dùng didUpdateWidget() Dùng didUpdateWidget()
image.png image.png

7. setState(): cũng là nhận biết sự thay đổi của Widget nhưng setState() chỉ sử dụng được khi bạn thực hiện thay đổi trong 1 class StatefulWidget không thể sử dụng 1 class StatefulWidget lồng trong 1 Widget.

8. deactivate(): hầu như mình không sử dụng phương thức này nên mình chỉ hiểu sơ là khi bạn thực hiện phương thức này thì phần tử (Element) sẽ tạm thời bị ẩn hoặc mất đi và bạn có thể gọi và sử dụng lại element đó

9. dispose() : khác với deactivate() thì khi sử dụng phương thức này thì phần tử (Element) sẽ bị xóa vĩnh viễn khỏi Element tree

10. mount là false: Đối tượng trạng thái (State) sẽ không thể lặp lại và lỗi sẽ được ném khi bạn gọi setState được gọi.

Đó là kiến thức cơ bản của mình. Cảm ơn các bạn đã xem.

Bình luận

Bài viết tương tự

- vừa được xem lúc

Học Flutter từ cơ bản đến nâng cao. Phần 1: Làm quen cô nàng Flutter

Lời mở đầu. Gần đây, Flutter nổi lên và được Google PR như một xu thế của lập trình di động vậy.

0 0 254

- vừa được xem lúc

Học Flutter từ cơ bản đến nâng cao. Phần 3: Lột trần cô nàng Flutter, BuildContext là gì?

Lời mở đầu. Màn làm quen cô nàng FLutter ở Phần 1 đã gieo rắc vào đầu chúng ta quá nhiều điều bí ẩn về nàng Flutter.

0 0 189

- vừa được xem lúc

Flutter Animation: Creating medium’s clap animation in flutte Part II

Trong phần 1 mình đã giới thiệu với các bạn cơ bản về Animation trong Flutter. Score Widget Size Animation.

0 0 53

- vừa được xem lúc

Flutter - GetX - Using GetConnect to handle API request (Part 4)

Giới thiệu. Xin chào các bạn, lại là mình với series về GetX và Flutter.

0 0 322

- vừa được xem lúc

StatefulWidget và StatelessWidget trong Flutter

I. Mở đầu. Khi các bạn build một ứng dụng với Flutter thì Widgets là thứ không thể thiếu đúng không ạ. Và 2 loại Widget không thể thiếu đó là StatefullWidget và StatelessWidget.

0 0 130

- vừa được xem lúc

Tìm hiểu về Riverpod - Provider nhưng không hắn :v

Trong Flutter có rất nhiều các quản lý state: Provider, Bloc, GetX, Redux,... khó mà nói cái nào tốt hơn cái nào. Tuy nhiên nếu bạn đã làm quen với Provider thì không ngại để tìm hiểu thêm về Riverpod. Một bản nâng cấp của Provider. Nếu bạn để ý thì cái tên "Riverpod" là các chữ cái của "Provider" đ

0 0 50