[英]Flutter/Dart - How can I change the State of a StatefulWidget from another StatefulWidget in a different file?
Background: I have a StatefulWidget for a navbar that displays the icon of the current page as active.背景:我有一个用于导航栏的 StatefulWidget,它将当前页面的图标显示为活动状态。 It already updates correctly if the user clicks in different icons from the navbar.
如果用户从导航栏中单击不同的图标,它已经正确更新。 But I also need it to update the active icon if the user clicks in a button outside of the navbar, whose code is located in a different StatefulWidget.
但是,如果用户单击导航栏外部的按钮,我还需要它来更新活动图标,其代码位于不同的 StatefulWidget 中。 To do so, I imagined that the function of the button should call a function from the navbar StatefulWidget, which uses setState and an index passed as a parameter to update the active icon.
为此,我想象按钮的 function 应该从导航栏 StatefulWidget 调用 function,它使用 setState 和作为参数传递的索引来更新活动图标。 However, my attempts so far have not worked.
但是,到目前为止,我的尝试都没有奏效。 The following error occurred:
发生以下错误:
The following assertion was thrown while handling a gesture:
处理手势时抛出以下断言:
I/flutter (24216): setState() called in constructor: TabsState#1bf6b(lifecycle state: created, no widget, not mounted) I/flutter (24216): This happens when you call setState() on a State object for a widget that hasn't been inserted into I/flutter (24216): the widget tree yet.I/flutter (24216): setState() called in constructor: TabsState#1bf6b(lifecycle state: created, no widget, not mounted) I/flutter (24216): This happens when you call setState() on a State object for a尚未插入 I/flutter (24216) 的小部件:尚未插入小部件树。 It is not necessary to call setState() in the constructor, since the state is
没有必要在构造函数中调用 setState(),因为 state 是
I/flutter (24216): already assumed to be dirty when it is initially created.`}I/flutter (24216):在最初创建时已经假定它是脏的。`}
The code from the parent widget was:父小部件的代码是:
[...]
Tabs({Key key, this.menuScreenContext, this.initialIndex}) : super(key: key);
final int initialIndex;
@override
TabsState createState() => TabsState();
}
class TabsState extends State<Tabs> {
PersistentTabController controller;
@override
void initState() {
super.initState();
controller = PersistentTabController(initialIndex: widget.initialIndex);
}
List<Widget> _buildScreens() {
return [
HomeScreen(),
[...]
void updateIndex(int index) {
setState(() {
controller.index = index;
});
}
}
Code from the child widget (class _HomeScreenState extends State ):子小部件的代码(类 _HomeScreenState 扩展 State ):
[...]
CustomButton(
function: () {
final tabsState = TabsState();
tabsState.updateIndex(2);
[...]
I tried to solve it by calling initState() at the child widget before calling setState(), but that did not work and as far as I understand, it creates another State object associated with the Stateful Widget, which seems like the wrong approach in this case since I only want to change the State of the existing navbar object.我试图通过在调用 setState() 之前在子小部件上调用 initState() 来解决它,但这不起作用,据我了解,它创建了另一个与 Stateful Widget 关联的 State object,这似乎是错误的方法这种情况下,因为我只想更改现有导航栏 object 的 State。
My question is: how can I call this function updateIndex(int index), that uses setState to update the navbar active icon, from the Button function inside another StatefulWidget, located in a different file, successfully?我的问题是:我如何调用这个 function updateIndex(int index),它使用 setState 来更新导航栏活动图标,从另一个 StatefulWidget 中的按钮 function 成功,位于不同的文件中?
I made it!我做到了! Based on the answers to this question( Controlling State from outside of a StatefulWidget ), I understood that a way to access the State of a different Stateful widget is to:
根据对这个问题的回答( Controlling State from outside of a StatefulWidget ),我了解到访问不同 StatefulWidget 的 State 的方法是:
1-> Declare the State class that you want to change on the child widget stateful widget, using findAncestorStateOfType which finds an ancestor of that type. 1-> 使用查找该类型祖先的 findAncestorStateOfType 声明要在子小部件有状态小部件上更改的 State class 。 For example:
例如:
class HomeScreen extends StatefulWidget {
static TabsState of(BuildContext context) =>context.findAncestorStateOfType<TabsState>();
2-> call the function from wherever you need inside the state class of this stateful widget, referring to the stateful widget class and using "of(context)". 2-> call the function from wherever you need inside the state class of this stateful widget, referring to the stateful widget class and using "of(context)". For example:
例如:
function: () {
HomeScreen.of(context).updateIndexFromCart(2);
3-> This function should be located inside the state class of the stateful widget that you previously referred, and then it is possible to use setState normally. 3-> 这个 function 应该位于您之前提到的有状态小部件的 state class 内部,然后可以正常使用 setState。 For example:
例如:
void updateIndexFromCart(int index) {
setState(() {
controller.index = index;
cartScreenFlag = true;
});
} }
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.