Facebook Pixel

Làm thế nào để chuyển màn hình mà không cần context trong Flutter?

07 Dec, 2021

Chau Le

Author

Nếu bạn muốn biết cách loại bỏ context khi navigate trong Flutter thì hãy đọc bài viết này nhé!

Làm thế nào để chuyển màn hình mà không cần context trong Flutter?

Mục Lục

Chúng ta sẽ học cách loại bỏ context khi navigate trong Flutter nhé.

Navigate là một phần không thể thiếu trong bất kì ứng dụng nào. Flutter sẽ hỗ trợ bạn navigate đến bất cứ màn hình nào một cách dễ dàng hơn chỉ với việc sử dụng các chức năng navigate đơn giản như Push và Pop.

Để Push:

Bash
Navigator.push(
    context,
    MaterialPageRoute(builder: (context) => SecondRoute()),
);

Để Pop:

Bash
Navigator.pop(context);

Điều này hoạt động khá tốt cho đến khi ứng dụng của bạn mở rộng quy mô và bạn tách logic nghiệp vụ của mình với logic UI. Và bây giờ bạn phải chuyển BuildContext từ một function này sang một function khác. Đôi khi việc này sẽ trở nên rắc rối khiến bạn muốn tránh việc chuyển context.

Đừng lo lắng nhé vì NavigatorKey sẽ giải cứu bạn.

1. Đầu tiên, hãy tạo Navigator Key

Bash
static final navigatorKey = GlobalKey<NavigatorState>();

2. Tiếp đến, hãy chuyển Navigator Key trong MaterialApp

Bash
return MaterialApp(
      ...
      navigatorKey: AppRouter.navigatorKey,
    );

3. Cuối cùng, hãy push bằng Navigator Key

Bash
navigatorKey.currentState?.push(
    MaterialPageRoute(builder: (_) => SecondRoute()),
);

Vậy là xong, chỉ với 3 bước đơn giản, bạn đã có thể loại bỏ context ra khỏi Navigation của mình. Bạn có thể kiểm tra code đầy đủ trên Github.

Bài viết được tham khảo từ Divyanshu Bhargava.

Bài viết liên quan

Lập trình backend expressjs

xây dựng hệ thống microservices
  • Kiến trúc Hexagonal và ứng dụngal font-
  • TypeScript: OOP và nguyên lý SOLIDal font-
  • Event-Driven Architecture, Queue & PubSubal font-
  • Basic scalable System Designal font-

Đăng ký nhận thông báo

Đừng bỏ lỡ những bài viết thú vị từ 200Lab