Flutter GetXController 动态Tabbar 报错问题

场景:

1.Tabbar的内容是接口获取的

2.

  TabController? tabController;;

在onInit 方法中初始化tabbarController

tabController = TabController(initialIndex: 0, length: titleDataList.length, vsync: this);

这时候会报一个错误

Controller's length property (0) does not match the number of children (3) p,

意思就是tabbar初始的length为0 这时去网络请求了title数据 数组长度变成了3 ,而tabController的长度还是0 所以会报错,解决办法就是:

在请求到标题数据后,再给tabbarController 重新赋值就好

    print("titleDataList====${titleDataList.length}");

        tabController = TabController(

            initialIndex: 1, length: titleDataList.length, vsync: this);

        tabController!.animateTo(0);

要在Flutter动态更新TabBar,可以使用TabController。TabController是一个控制TabBarTabBarView的类,它可以让你在TabBar中切换选项卡时更新TabBarView中的内容。以下是一个简单的示例代码: ```dart class MyTabbedPage extends StatefulWidget { const MyTabbedPage({Key? key}) : super(key: key); @override State<MyTabbedPage> createState() => _MyTabbedPageState(); } class _MyTabbedPageState extends State<MyTabbedPage> with SingleTickerProviderStateMixin { late TabController _tabController; @override void initState() { super.initState(); _tabController = TabController(length: 3, vsync: this); } @override void dispose() { _tabController.dispose(); super.dispose(); } @override Widget build(BuildContext context) { return Scaffold( appBar: AppBar( bottom: TabBar( controller: _tabController, tabs: const [ Tab(text: 'Tab 1'), Tab(text: 'Tab 2'), Tab(text: 'Tab 3'), ], ), ), body: TabBarView( controller: _tabController, children: const [ Center(child: Text('Tab 1')), Center(child: Text('Tab 2')), Center(child: Text('Tab 3')), ], ), floatingActionButton: FloatingActionButton( onPressed: () { _tabController.animateTo(1); // 切换到第二个选项卡 }, child: const Icon(Icons.arrow_forward), ), ); } } ``` 在这个示例中,我们创建了一个TabController并将其与TabBarTabBarView一起使用。我们还在Scaffold中添加了一个FloatingActionButton,当用户点击它时,我们使用TabController的animateTo方法将选项卡切换到第二个选项卡。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值