我正在尝试使用Flutter构建应用程序,遇到了一个小问题。我正在尝试使用BottomNavigaionBar样式的应用程序,其中包含三个页面。(见第一个片段)布局使用三个“ChorePage”类型的对象。似乎应用程序创建了三个ChorePage实例,但是只创建了_ChorePageState的一个实例。
这导致_dataRows变量在三个选项卡之间共享,这意味着我不能将不同的信息放入不同的选项卡中。为什么会发生这种情况,我该如何防止它?
我已经在createState()函数中放置了print语句,并在每次重建ChorePage时打印PopulateRows函数中的“this”变量。下面的打印输出确认了确实三个组件使用相同的State对象。(createState仅对对象A调用一次且this变量引用相同的对象)
这导致_dataRows变量在三个选项卡之间共享,这意味着我不能将不同的信息放入不同的选项卡中。为什么会发生这种情况,我该如何防止它?
我已经在createState()函数中放置了print语句,并在每次重建ChorePage时打印PopulateRows函数中的“this”变量。下面的打印输出确认了确实三个组件使用相同的State对象。(createState仅对对象A调用一次且this变量引用相同的对象)
class AppLayout extends StatefulWidget {
@override
_AppLayoutState createState() => _AppLayoutState();
}
class _AppLayoutState extends State<AppLayout> {
int _currentIndex = 0;
String title = 'Test';
List<Widget> _children = [
new ChorePage(Title:'A'),
new ChorePage(Title:'B'),
new ChorePage(Title:'C')
];
@override
Widget build(BuildContext context) {
//STUFF BEFORE INIT
return Scaffold(
appBar: AppBar(
title: Text('$title'),
),
body: _children[_currentIndex],
bottomNavigationBar: BottomNavigationBar(
onTap: onTabTapped,
currentIndex: _currentIndex,
items:[
BottomNavigationBarItem(
icon: Icon(MdiIcons.sprayBottle),
title:Text('Menu1'),
),
BottomNavigationBarItem(
icon: Icon(MdiIcons.glassMugVariant),
title:Text('Menu2'),
),
BottomNavigationBarItem(
icon: Icon(Icons.event_note),
title:Text('Menu3'),
)
]
),
);
}
void onTabTapped(int index){
setState(() {
_currentIndex = index;
});
}
}
任务页面
class ChorePage extends StatefulWidget {
final String Title;
const ChorePage({Key key, this.Title}): super(key: key);
@override
_ChorePageState createState() {
print('Creating: '+this.Title);
return new _ChorePageState();
}
}
class _ChorePageState extends State<ChorePage> {
List<DataRow> _dataRows = [];
@override
Widget build(BuildContext context) {
PopulateRows();
return SingleChildScrollView(
child:Center(
child: DataTable(
columns: [
DataColumn(label: Text(widget.Title.toString())),
DataColumn(label: Text('Col1')),
DataColumn(label: Text('Col2')),
],
rows: _dataRows,
),
),
);
}
void PopulateRows(){
print(this);
print(widget.Title.toString());
//_dataRows = [];
for(int i=0;i<1;i++) {
DataRow R = DataRow(cells:[]);
R.cells.add(DataCell(Text(widget.Title)));
R.cells.add(DataCell(Text(i.toString())));
R.cells.add(DataCell(Text((i + 1).toString())));
_dataRows.add(R);
}
}
}
输出结果:
Installing build\app\outputs\apk\app.apk...
Debug service listening on ws://127.0.0.1:59033/TvJtQ-PN3a8=/ws
Syncing files to device Mi 9T Pro...
I/flutter (28856): Creating: A
I/flutter (28856): _ChorePageState#d1d35
I/flutter (28856): A
I/xxxxxxx.tms_ap(28856): ProcessProfilingInfo new_methods=403 is saved saved_to_disk=1 resolve_classes_delay=8000
I/flutter (28856): _ChorePageState#d1d35
I/flutter (28856): B
I/flutter (28856): _ChorePageState#d1d35
I/flutter (28856): C