【问题标题】:Flutter - How to pass data between pages in PageView Widget?Flutter - 如何在 PageView Widget 中的页面之间传递数据?
【发布时间】:2020-04-24 17:06:57
【问题描述】:

我有一个如下所示的 PageView 小部件:

Widget buildPageView() {
    return PageView(
      controller: pageController,

      onPageChanged: (index) {
        pageChanged(index);
      },

      children: <Widget>[
        AddPropertyDescription(pageController: pageController,),
        AddPropertyMedia(pageController: pageController),
        AddPropertyLocation(pageController: pageController),
        AddPropertyDetails(pageController: pageController),
        AddPropertyAmenities(pageController: pageController)
      ],
    );
  }

我的 PageView 中有五个页面作为小部件,现在我想将数据从一个页面传递到另一个页面,直到页面更改时的最后一页.....

我在每个页面中都使用了Next 按钮,在 Next 按钮 onTap() 中,我只需增加页码以滑动到下一页,如下所示

 onTap: () async{
                  pageController.animateToPage(
                    1,
                    duration: Duration(milliseconds: 300),
                    curve: Curves.linear,
                  );
              }, 

当按下下一个按钮并转到下一个屏幕时,我想携带数据并将其传递到下一页。

这里有没有人可以在颤振中遇到同样的问题.....

请指导我如何实现这一目标......

【问题讨论】:

    标签: flutter dart flutter-pageview


    【解决方案1】:

    Page 小部件可以获取数据,以及用于传递数据的回调,我将解释我的意思。

    buildPageView 应该将额外参数传递给小部件:

    
    int data = 0;
    
    void onDataChange(int newData) {
      setState(() => data = newData);
    }
    
    Widget buildPageView() {
        return PageView(
          controller: pageController,
    
          onPageChanged: (index) {
            pageChanged(index);
          },
    
          children: <Widget>[
            AddPropertyDescription(pageController: pageController, data: data, onDataChange: onDataChange),
            AddPropertyMedia(pageController: pageController, data: data, onDataChange: onDataChange),
            AddPropertyLocation(pageController: pageController, data: data, onDataChange: onDataChange),
            AddPropertyDetails(pageController: pageController, data: data, onDataChange: onDataChange),
            AddPropertyAmenities(pageController: pageController, data: data, onDataChange: onDataChange)
          ],
        );
      }
    

    并且小部件本身应该除了参数:

    class MyWidget extends StatelessWidget {
      const MyWidget({
        @required this.data,
        @required this.onDataChange,
        Key key,
      }) : super(key: key);
    
      final int data;
      final Function(int) onDataChange;
    
      @override
      Widget build(BuildContext context) {
        return FlatButton(
          onPressed: () => onDataChange(data + 1),
          child: Text(data.toString()),
        );
      }
    }
    
    

    【讨论】:

    • final Function(var) onDataChange;这个语句给了我这个错误 => 函数类型参数不能指定 'const'、'final' 或 'var' 代替返回类型。
    • 抱歉,已修复。
    • 您能解释一下 MyWidget 是什么吗?是来自 PageVIew 的 Widget 还是 Pageview 中的 Widget?我有点困惑,因为它没有页面控制器。你有完整的例子吗?
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 2021-05-28
    • 2021-01-08
    • 1970-01-01
    • 2018-01-06
    • 2020-09-10
    • 2012-09-12
    • 2010-11-13
    相关资源
    最近更新 更多