如何在 Flutter 的 BottomNavigationBar 项目中使用 setState()？

Question

我想在 BottomNavigationBar 项目中使用 DropdownButton。但无法使用 setState()。我看到这个错误：- 无法在初始化程序中访问实例成员“setState”。 尝试用不同的表达式替换对实例成员的引用dart(implicit_this_reference_in_initializer)

还有这个错误：- 无法在初始化程序中访问实例成员“numDropdownVal”。 尝试用不同的表达式替换对实例成员的引用dart(implicit_this_reference_in_initializer)

这是完整的代码：

class _MyStatefulWidgetState extends State<MyStatefulWidget> {
  int _selectedIndex = 0;
  String numDropdownVal = 'One';

  static const TextStyle optionStyle =
      TextStyle(fontSize: 30, fontWeight: FontWeight.bold);
  static List<Widget> _widgetOptions() {
    return<Widget>[
    Container(
      child: DropdownButton<String>(
                                isExpanded: true,
                                value: numDropdownVal,
                                items: <String>[
                                  'One',
                                  'Two',
                                  'Three',
                                  'Four',
                                  'Five',
                                  'Six'
                                ].map((name) {
                                  return DropdownMenuItem<String>(
                                    value: name,
                                    // Your row here:
                                    child: Text(
                                          name,
                                          style: TextStyle(fontSize: 18),
                                        ),
                                  );
                                }).toList(),
                                onChanged: (selectedName) {
                                  setState(() {
                                    numDropdownVal = selectedName;
                                  });
                                },
                              ),
    ),
    Text(
      'Other page',
      style: optionStyle,
    ),
    Text(
      'Another page',
      style: optionStyle,
    ),
  ];
  }

  void _onItemTapped(int index) {
    setState(() {
      _selectedIndex = index;
    });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text('BottomNavigationBar Sample'),
      ),
      body: Center(
        child: _widgetOptions.elementAt(_selectedIndex),
      ),
      bottomNavigationBar: BottomNavigationBar(
        items: const <BottomNavigationBarItem>[
          BottomNavigationBarItem(
            icon: Icon(Icons.home),
            label: 'Home',
          ),
          BottomNavigationBarItem(
            icon: Icon(Icons.business),
            label: 'Business',
          ),
          BottomNavigationBarItem(
            icon: Icon(Icons.school),
            label: 'School',
          ),
        ],
        currentIndex: _selectedIndex,
        selectedItemColor: Colors.amber[800],
        onTap: _onItemTapped,
      ),
    );
  }
}

Answer 1

以下错误：

无法在初始化程序中访问实例成员“setState”。 尝试用不同的替换对实例成员的引用 expressiondart(implicit_this_reference_in_initializer)

还有这个错误：- 实例成员 'numDropdownVal' 不能是 在初始化程序中访问。尝试替换对 具有不同的实例成员 expressiondart(implicit_this_reference_in_initializer)

发生是因为，正如错误所说，您在初始化变量时尝试访问实例成员（尚未实例化）。

以下代码不正确：

class _MyStatefulWidgetState extends State<MyStatefulWidget> {
  int _selectedIndex = 0;
  String numDropdownVal = 'One';

  static List<Widget>  _widgetOptions = <Widget>[
    Container(
      child: DropdownButton<String>(
        isExpanded: true,
        value: numDropdownVal, // You can't access the 'numDropdownVal' variable yet
                               // because it's not yet instantiated.

    ...
  ];

  ...
}

要修复它，您可以将变量更改为implicit getter：

List<Widget> get _widgetOptions => <Widget>[...];

或将其更改为返回widget列表的方法：

List<Widget> _widgetOptions () {
  return <Widget>[...];
}