如何在flutter / Dart中保存和传递变量/数据而无需导航？

Question

我有一个名为“newstHomes”的页面，所以这是一个我从我的 api 接收房屋列表的页面，它将在此处列出。所以对于每个家庭，我都会声明一个最喜欢的按钮。所以当我想点击我最喜欢的按钮时，保存我的家庭 id 并且没有导航保存它并将其传递到另一个页面。 这是我的代码：

return GridView.builder(
      gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
          crossAxisCount: 1, childAspectRatio: 3 / 1.5),
      itemCount: widget.item.length,
      itemBuilder: (context, index) {
        return InkWell(
          onTap: (){
            Navigator.of(context).push(MaterialPageRoute(
                builder: (context) => PropertyDetailsPage(),
                settings: RouteSettings(
                    arguments: widget.item[index]
                )
            ));
          },
          child: Align(
            alignment: Alignment.topCenter,
            child: SizedBox(
              width: MediaQuery.of(context).size.width / 1.04,
              height: MediaQuery.of(context).size.height / 5,
              child: Container(
                child: Stack(
                  children: [
                    Row(
                      children: [
                        FavoriteButton(
                          iconSize: MediaQuery.of(context).size.width / 10,
                          isFavorite: false,
                          valueChanged: (var isFave){
                            widget.favorite = isFave;
                            widget.propertyID = widget.item[index].Id;
                          },
                        ),
                        Padding(padding: EdgeInsets.only(right: MediaQuery.of(context).size.width / 15,
                        )),
                        Text(widget.item[index].Price,
                          style: TextStyle(
                              fontFamily: "IranSans",
                              fontSize: MediaQuery.of(context).size.width / 22
                          ),
                        ),
                      ],
                    ),
                    Align(
                      alignment: Alignment.center,
                      child: Padding(
                        padding: EdgeInsets.only(top: MediaQuery.of(context).size.height / 14,
                            left: MediaQuery.of(context).size.width / 30,
                            right: MediaQuery.of(context).size.width / 8
                        ),
                        child: Align(
                          alignment: Alignment.center,
                          child: Column(
                            children: [
                              Text(widget.item[index].Title,
                                textDirection: TextDirection.rtl,
                                style: TextStyle(
                                    fontSize: MediaQuery.of(context).size.width / 25,
                                    fontFamily: "IranSans"
                                ),
                              ),
                              Text(widget.item[index].Area.toString() + ' ' + 'متر مفید',
                                textDirection: TextDirection.rtl,
                                style: TextStyle(
                                    fontFamily: "IranSans",
                                    fontSize: MediaQuery.of(context).size.width / 29,
                                    color: Colors.grey[700]
                                ),
                              ),
                              Text(widget.item[index].DataInsert.toString(),
                                textDirection: TextDirection.rtl,
                                style: TextStyle(
                                    fontFamily: "IranSans",
                                    fontSize: MediaQuery.of(context).size.width / 29,
                                    color: Colors.grey[700]
                                ),
                              ),
                            ],
                          ),
                        ),
                      ),
                    ),
                    Row(
                      children: [
                        Padding(
                          padding: EdgeInsets.only(left: MediaQuery.of(context).size.width / 6),
                          child: Align(
                            alignment: Alignment.bottomLeft,
                            child: Text(widget.item[index].DataInsert.toString(),
                              textDirection: TextDirection.rtl,
                              style: TextStyle(
                                  fontFamily: "IranSans",
                                  fontSize: MediaQuery.of(context).size.width / 29,
                                  color: Colors.grey[700]
                              ),
                            ),
                          ),
                        ),
                      ],
                    ),
                    Align(
                      alignment: Alignment.centerRight,
                      child: SizedBox(
                        height: MediaQuery.of(context).size.height -3,
                        width: MediaQuery.of(context).size.width / 4,
                        child: Image.network('https://api.shaarapp.ir/ImageSave/' + widget.item[index].Image,
                          fit: BoxFit.fill,
                        ),
                      ),
                    ),
                  ],
                ),
                decoration: BoxDecoration(
                  border: Border.all(color: Colors.grey),
                ),
              ),
            ),
          ),
        );
      },
    );

Answer 1

您可以使用 GestureDetector 来包装您的 FavoriteButton 小部件。

代码将类似于：

GestureDetector(
  child: FavoriteButton(
  iconSize: MediaQuery.of(context).size.width / 10,
  isFavorite: false,
  valueChanged: (var isFave){
  widget.favorite = isFave;
  widget.propertyID = widget.item[index].Id;
  },
),
onTap: () {
  /// Your favorite logic here.
}),

用于让其他小部件知道您最喜欢的 id 的值。你可以使用Provider 依赖。

这个概念是你可以创建一个类来保存最喜欢的 id 和其他类似扩展 ChangeNotifier 的值。

    class MyFavoriteData extends ChangeNotifier {
      List<String> _ids = [];
    
      UnmodifiableListView<Post> get ids {
        return UnmodifiableListView(this._ids);
      }

      void addFavorite(String id) {
         this._ids.add(id);
         notifyListeners();
      }
      
      void removeFavourite(String id) {
         this._ids.remove(id);
         notifyListeners();
      }
}

notifyListeners(); 方法会告诉所有听这个类的人，当addFavorite(id) 或removeFavorite(id) 触发时，数据会发生变化。

现在，您必须在您的应用中实现如下提供程序。

class MyApp extends StatelessWidget {
 
  @override
  Widget build(BuildContext context) {
    return MultiProvider(
      providers: [
        ChangeNotifierProvider(create: (context) {
        var myFavoriteData = MyFavoriteData();
          return myFavoriteData;
        }),
      ],
      child: MaterialApp(
      ... continue your code
      ),
    );
}

最后。当您想收听 MyFavoriteData 时。您可以像下面这样使用消费者小部件：

return Consumer<MyFavoriteData>(
  builder: (context, myFavoriteData, child) {
    return Text("All favorite ids: ${myFavoriteData.ids}");
  },
);

愉快的编码。 :)