时间戳

首页 > 解决方案 > 如何在 IndexedStack 中重建页面

flutter - 如何在 IndexedStack 中重建页面

问题描述

我有两个页面，一个是您查看一堆电影的页面，您可以在其中喜欢堆栈顶部的电影并移至下一个页面 PAGE A，第二个页面在列表PAGE中显示喜欢的电影乙。

每次我喜欢或不喜欢一部电影时，我都可以去PAGE B，我应该能够看到我喜欢的电影，但是因为我使用的是 IndexedStack，所以PAGE B没有被重建，因此，不显示更新的列表。

当我重新输入PAGE B时，有没有办法重建它？

这是我所拥有的：

class HomePage extends StatefulWidget {
  //
  static String id = 'home';
  //
  @override
  _HomePageState createState() => _HomePageState();
}

class _HomePageState extends State<HomePage> {
  //
  List<Widget> _pages = [MovieStackPage(), LikedMoviesPage()];
  int pageIndex = 0;
  //
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: Colors.white,
      body: SafeArea(
        child: IndexedStack(
          index: pageIndex,
          children: _pages,
        ),
      ),
      bottomNavigationBar: AnimatedBottomNavigationBar(
        icons: [...],
        iconSize: 25,
        elevation: 50,
        activeIndex: pageIndex,
        leftCornerRadius: 32,
        rightCornerRadius: 32,
        activeColor: User.color,
        inactiveColor: kAppIconGray,
        splashColor: User.color.withOpacity(.3),
        onTap: (index) => setState(() => pageIndex = index),
      ),
    );
  }
}

我正在为 BottomNavBar 使用一个包，但这应该不是问题。

标签： flutter

解决方案

从您的页面列表中删除该页面并在同一索引处再次添加它：

onTap: (index) {
      _pages.removeAt(1);
      _pages.insert(1, LikedMoviesPage());
      setState(() => pageIndex = index);
},

推荐阅读