跨多个页面持久化提供者数据不起作用

Jes*_*ica 7 state-management dart flutter flutter-provider

Provider在我的 flutter 应用程序中使用,当我转到一个新页面时,Provider在第 2 页中无法访问提供给第 1页的数据。

我理解这种Provider工作方式的方式是,有一个中心位置可以存储所有数据,并且可以在应用程序的任何位置访问该数据。所以在我的应用程序中,如下所示,ToDoListManager是存储所有数据的地方。如果我在 中设置数据Page 1,那么我将能够在 中访问该数据Page 2,反之亦然。

如果这不正确,那么哪部分是错误的?为什么它在我的应用程序中不起作用?

这是代码

第 1 页

class Home extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return ChangeNotifierProvider(
      builder: (context) => ToDoListManager(),
      child: Scaffold(
        appBar: AppBar(
          title: Text('Cool Project'),
        ),
        body:e ToDoList(),
      ),
    );
  }
}

class ToDoList extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    final toDoListManager = Provider.of<ToDoListManager>(context);

    return ListView.builder(
      itemCount: toDoListManager.toDoList.length,
      itemBuilder: (context, index) {
        return GestureDetector(
          onTap: () {
            Navigator.push(context,
                MaterialPageRoute(builder: (context) => Details(index)));
          },
          child: Text(toDoListManager.toDoList[index]),
        );
      },
    );
  }
}
Run Code Online (Sandbox Code Playgroud)

第2页

class Details extends StatelessWidget {
  final int index;

  Details(this.index);

  @override
  build(BuildContext context) {
    return ChangeNotifierProvider(
      builder: (context) => ToDoListManager(),
      child: Scaffold(
          appBar: AppBar(
            title: Text('Details Bro'),
          ),
          body: AppBody(index)),
    );
  }
}

class AppBody extends StatelessWidget {
  final int index;

  AppBody(this.index);

  @override
  Widget build(BuildContext context) {
    final toDoListManager = Provider.of<ToDoListManager>(context);
    print(toDoListManager.toDoList);

    return Text(toDoListManager.toDoList[1]);
  }
}
Run Code Online (Sandbox Code Playgroud)

待办事项列表提供者

class ToDoListManager with ChangeNotifier {
  List<String> _toDoList = ['yo', 'bro'];

  List<String> get toDoList => _toDoList;

  set toDoList(List<String> newToDoList) {
    _toDoList = newToDoList;
    notifyListeners();
  }
}
Run Code Online (Sandbox Code Playgroud)

Mar*_*yns 6

您有 2 个选择:

  1. 将您ChangeNotifierProvider放在您的上方,MaterialApp以便从您的任何Navigator路线都可以访问。

  2. 保持Home小部件不变,但在推送新小部件时Navigator提供原始管理器。

onTap: () {
    Navigator.push(
        context,
        MaterialPageRoute(
            builder: (context) {
                return Provider<ToDoListManager>.value(
                    value: toDoListManager,
                    child: Details(index),
                );
            },
        ),
    );
},
Run Code Online (Sandbox Code Playgroud)

使用这两种方法,您都不需要ChangeNotifierProvider在详细信息屏幕中创建新的。