Flutter 提供者将列表中的单个对象传递给子视图

Question

我有一个页面显示 ListView，其中包含学校的列表。因此，当用户单击 My Schools.

时，我会加载所有学校（在 initState() 方法中）

现在我想在用户点击学校时传递学校对象ListView 并显示 edit school 页面。

我想为此使用提供者模式，这样我就可以传递一个单个学校对象到编辑页面，一旦用户完成编辑和后退，它会自动在 ListView.

中反映 更新后的 school

我真的很困惑如何将单个对象从列表传递到编辑页面。以下是我的代码，其中包含模型、提供者和状态类。由于我不知道如何在编辑页面中访问学校对象，所以我还没有创建它。

我不想使用构造函数来传递要编辑的学校对象。

// School model class
class SchoolModel {
  String name;
  double points; 
}

// school provider
class SchoolProvider with ChangeNotifier {
   School _school;
   School get school => _school;

   set School(School value) {
       _school = value;
        notifyListeners();
   }
}

// School list page
class ListSchool extends StatefulWidget {
   @override
  _ListSchoolState createState() => _ListSchoolState();
}

// List page state
class _ListSchoolState extends State<ListSchool> {
    List<School> _schools;
    @override
    void initState() {
       _schools = FirebaseCall(); // loading schools
    }
}

@override
Widget build(BuildContext context) {
return Scaffold(
   body: MultiProvider(
            providers: [
              ChangeNotifierProvider(
                create: (context) => SchoolProvider(),
              ),
            ],
             child: ListView.builder(
                itemCount: _schools.length,
                itemBuilder: (BuildContext ctxt, int index) {
                   return ListTile(
                       title: Text(_schools[index].name);
                       onTap() {
                          // Open Edit page and pass the clicked school object to edit page
                       }
                   );
                }
             )
         )
);

谢谢

Answer 1

我认为您需要更改更改通知程序，使其成为您要更新的列表。

class SchoolsProvider with ChangeNotifier {
   List<School> _schools;
   School get schools => _schools;

   SchoolProvider(this._schools = const []);

   void addSchool(School newSchool) { 
     _schools.add(newSchool); 
     notifyListeners();
   }

   void removeShool(String schoolName) {
     _schools.removeWhere((s) => s.name == schoolName);
     notifyListeners();
   }

   void updateSchool(String shoolName, double points) {
     _schools.removeWhere((s) => s.name == schoolName);
     addSchool(School(schoolName, points));
   }
}

当您点击 ListTile 时，您只需推送新页面，然后输入所需的学校。

Consumer<SchoolsProvider>(
    builder: (_, schools, __) => ListView.builder(
     itemCount: schools.length,
     itemBuilder: (BuildContext ctxt, int index) {
      return ListTile(
        title: Text(schools[index].name),
        onTap() {
           Navigator.push(context, MaterialRoutePage(
             context,
             builder: (_) => YourNewPage(school: schools[index]),
           ));      
        },
      );
    },
  ),
),

在新页面中，您只需访问 Provider 中声明的方法，这将更新侦听器


class NewPage extends StatelessWidget {

  final School school;
 
  NewPage({this.school});

  ...
  
  //Here you can perform any action on the schools Provider
  // It will notify it's listeners (Consumer) so it gets updated
  schools[index].add
  schools[index].remove
  schools[index].update  

  ...

Flutter 提供者将列表中的单个对象传递给子视图

Flutter provider to pass a singe object out of list to the child view

flutter

flutter-provider