如何使用 GetX 使 Flutter 等待數據加載

巴蘇姆

我正在尋找一種最佳實踐方法來實現在顯示第一頁之前等待我的應用程序初始化數據。

該應用程序有一個主控制器以及每頁一個控制器。主控制器最初從服務器加載數據,在完成之前我想顯示一個啟動頁面(或者至少在打開實際的應用程序頁面之前等待)

一個簡單的解決方案是,頁面等待主控制器初始化

class MainController extends GetxController {
  final isInitialized = false.obs;

  @override
  void onInit() async {
    Future f1 = server.get('service1').then(....)
    Future f2 = server.get('service1').then(....)
    Future f3 = server.get('service1').then(....)
    await Future.wait([f1, f2, f3]);
    isInitialized.value = true;
  }
}

一個頁面組件可以:

class HandleTaskPage extends GetView<HandleTaskPageController> {

  @override
  Widget build(BuildContext context) {
    MainController mainController = Get.find();

    return Obx(() {
        if (mainController.isInitialized().value) {
            return TaskPanelWidget();
        } else {
            return WaitingPage();
        }
    })
  }
}

但是我的應用程序允許用戶使用直接 url(網絡應用程序)從任何給定頁面開始,例如http://app.com/showtask/123這意味著我必須在每個頁面上放置等待全局控制器。

有什麼方法可以讓 Get 等待(並可能顯示一個歡迎頁面),直到 GlobalController 準備就緒,然後才能進入路線中描述的頁面?

我嘗試向 GetMaterialApp 添加 WelcomePage,以阻止應用程序直接轉到請求的 url。WelcomeController 應該在重定向之前等待 MainController。但是即使歡迎頁面確實被呈現,應用程序仍然會自動繼續到 url 中請求的頁面。

void main() {
  runApp(GetMaterialApp(
    home: WelcomePage(),
    ...
    ...
    ...
穆罕默德·安迪卡

您可以使用名稱StateMixin實現 mixin

示例(控制器):

class UserController extends GetxController with StateMixin {
    getData() {
        // make status to loading
        change(null, status: RxStatus.loading());
        
        // Code to get data
        await service.getData()

       // if done, change status to success
       change(null, status: RxStatus.success());
    }
}

示例(用戶界面):

class HomePage extends GetView<UserController> {

  @override
  Widget build(BuildContext context) {

    // controller from GetView
    return controller.obx((state) {
        return OtherWidget()
    },
    onLoading: CircularProgressIndicator(),
   )
  }
}

本文收集自互联网,转载请注明来源。

如有侵权,请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章

在Flutter GetX中使用没有控制器的可观察变量

Flutter GetX RxList 分配问题

Flutter 和 Getx:如何将参数从 UI 传递到 Getx 控制器?

如何使用 Getx 在 Flutter 中为特定列表项增加计数器?

Flutter 和 Getx:可观察对象如何发出变化

Flutter 使用 Getx 更改图标按钮的主题和图标

如何在 Flutter 中使用 GetX 收听 FocusNode

如何使用 Scrapy 從可以加載更多帖子的網站上抓取數據?

flutter getx web sockets - 要級聯到提供者和控制器的流數據

如何在 redis 時間序列數據庫中批量加載數據?

我是否必須在我的 Flutter 應用程序中使用 Getx 控制器?

Flutter GetX 將數據傳遞到另一個頁面

Flutter,如何使用 getx 刷新我的控制器和請求

SwiftUI Firestore 等待加載數據

Flutter GetX Obx [Get] 已檢測到 GetX 的不當使用。您應該只對將更新的特定小部件使用 GetX 或 Obx

如何使用數組類型列從 CSV 加載數據以生成數據框

Flutter - Futurebuilder 僅在重新加載後顯示數據

Flutter getx - 使用 recative 列表作為參數會導致錯誤使用 getx 錯誤

如何在渲染前使用 axios 完全加載數據

如何使用 NSTableViewDiffableDataSource 通過 NSTableView 加載數據

使用apps腳本加載網頁後,如何獲取ajax(異步)方法加載的數據?

如何使用延遲加載模塊將數據傳遞給路由?

如何使用python將數據加載到redshift表中?

等待redux加載數據

Flutter 使用 GetX 本地化 Syncfusion 日历

Firestore-Flutter-GetX:如何获取文档 ID 以更新 Firestore 中的记录

Flutter Getx 本地存储数据

如何使用 getx 传递参数?

使用 Getx 管理 Flutter ListView.builder