flutter - 如何构建应用程序状态以便所有相关的小部件在状态更改时更新？

Question

我在 SharedPreferences 中保留了多个帐户，并希望使当前帐户(用户在对话框中选择)在整个应用程序中都可访问。当用户更改当前帐户时，UI 应自动更新以显示该帐户。但是，我尝试过的应用状态系统不会在当前用户更改时更新我的​​ StatefulWidgets。

我已经尝试过 SharedPreferences、InheritedWidget、Provider 和 ChangeNotifier。我一直无法监听 SharedPreferences 的变化，其他解决方案在状态变化时不会更新 UI。

// Main.dart

void main() => runApp(
  ChangeNotifierProvider<AppStateManager>.value(
    value: AppStateManager(),
    child: MyApp()
  )
);

class AppStateManager extends ChangeNotifier {
  int _currentStudentIndex;
  int get currentStudentIndex => _currentStudentIndex;

  set currentStudentIndex(int index) {
    _currentStudentIndex = index;
    notifyListeners();
  }
}

// Code that runs when the user selects a new account

onPressed: () {
  Provider.of<AppStateManager>(context).currentStudentIndex = index;
  Navigator.pop(context);
},

// The state for my StatefulWidget 

_TodayState() {
    getCurrentStudent().then((student) => setState(() {
      _currentStudent = student;
    }));
}

Future<Student> getCurrentStudent() async {
  List<String> students = await PreferencesManager.getStudents();

  final AppStateManager stateManager = Provider.of<AppStateManager>(context);

  Map<String, dynamic> currentStudent = jsonDecode(students[stateManager.currentStudentIndex ?? 0]);

  return Student.fromJson(currentStudent);
}

Answer 1

我尝试从提供的片段中重新创建您的代码，并且可以重现您的问题 ( here )。您正在正确设置状态并调用 notifyListeners()但是您没有在构建方法中使用状态。你假设 _TodayState每次看到它时都会构建，但事实并非如此。例如，如果它在事件堆栈中(例如，当您将导航器路由推到它上面时)，Flutter 会将它保存在内存中。

换句话说，您的构造函数代码 ( getCurrentStudent().then(...)) 没有像您想象的那样频繁执行。

为确保您的 UI 得到更新，请将内容放在 build() 中方法。例如:

Consumer<AppStateManager>(
  builder: (context, manager, child) => FutureBuilder<Student>(
    future: getCurrentStudent(manager.currentStudentIndex),
    builder: (context, snapshot) {
      if (!snapshot.hasData) {
        return const CircularProgressIndicator();
      }
      return Text('Student: ${snapshot.data.name}');
    },
  ),
),

这行得通。 Here的要点。它确实会在每次状态发生变化时获取学生，这可能是您想要的，也可能不是您想要的。

如果你绝对需要混合setState 、futures 和 InheritedWidgets，您可能需要手动收听提供的值(使用类似 stateManager.addListener(listener) 的内容)。但最好避免这种情况，因为它可能是错误的来源。

作为提供者的一般建议:在构建方法中听取它(使用 Consumer<...> 或 Provider.of<...> )，而不是其他任何地方。