如何使用 Navigator 2.0 更新页面内容答案

【问题标题】：How to update a page content with Navigator 2.0如何使用 Navigator 2.0 更新页面内容
【发布时间】：2021-05-11 13:06:15
【问题描述】：

我在 Flutter 中使用 Navigator 2.0，并且我的页面有一个类型和一个代码来标识自己。

我有一个由Listile组成的Drawer，可以跳转到不同类型和代码的页面，也可以跳转到相同类型但不同代码的页面。 所以我的问题是在相同类型和不同代码的页面之间导航

这是我的委托页面堆栈：

  List<Page> get _loggedInStack {
    final onLogout = () async {
      await auth.logout();
      splash = true;
      loggedIn = false;
      _clear();
    };
    return [
  if (selectedPageType == "dashboard")
    DashboardPage(
        onPageChange: (String page, String code) {
          selectedPageType = page;
          selectedPageCode = code;
          print(selectedPageCode);
        },
        id: selectedPageCode,
        onLogout: onLogout),
   if (selectedPageType == "chart")
        ChartPage(
            id: selectedPageCode,
            onPageChange: (String page, String code) {
              selectedPageType = page;
              selectedPageCode = code;
              print(selectedPageCode);
            },
            onLogout: onLogout),
       ...
    ];
  }

这是我转到选定页面的位置：

  goToSelectedPage(String type, String config) {
    switch (type) {
      case ('Monitoring'):
        widget.onPageChange('dashboard', config);
        break;
      case ('Charts'):
        widget.onPageChange('chart', config);
        break;
      
      ...
    }
  }

这里是一个页面的例子：

class DashboardPage extends Page {
  DashboardPage(
      {required this.onPageChange, required this.onLogout, required this.id})
      : super(key: ValueKey(AppStrings.DASHBOARD_PAGE_KEY));

  final Function(String, String) onPageChange;
  final VoidCallback onLogout;
  final String id;

  @override
  Route createRoute(BuildContext context) {
    return PageRouteBuilder(
        transitionDuration: Duration(seconds: 0),
        settings: this,
        pageBuilder: (context, animation1, animation2) {
          return DashboardScreen(
            onPageChange: onPageChange,
            onLogout: onLogout,
            id: id,
            key: ValueKey(AppStrings.DASHBOARD_SCREEN_KEY),
          );
        });
  }
}

this is what happen

所以，当我尝试从具有相同 selectedPageType 但不相同 selectedPageCode 的页面更改时，什么也没有发生

【问题讨论】：

标签： flutter dart

【解决方案1】：

欢迎加入社区！

问题似乎是在用不同的selectedPageCode 调用相同的selectedPageType 时，您使用的是相同的密钥（AppStrings.DASHBOARD_SCREEN_KEY）。因此，请尝试在每次调用 DashboardPage 和 DashboardScreen 时更改密钥，例如添加 selectedPageCode：

key: ValueKey(AppStrings.DASHBOARD_SCREEN_KEY + selectedPageCode)

这样做，您应该不会再有任何问题了！

【讨论】：

哦，你是对的！非常感谢，你救了我的命