选择某些内容时，下拉菜单不会更新（Flutter）

Question

我正在尝试在我的 Flutter 项目中创建一个 DropDown 菜单，但是当我按下一个值时，它的值并没有改变。我尝试了几种不同的代码和教程，但它似乎永远不会改变。这是我的代码：

    body: Container(
      padding: EdgeInsets.fromLTRB(10.0, 20.0, 10.0, 30.0),
      child: Column(
        children: <Widget>[
          TextField(
            controller: myController,
            decoration: InputDecoration(
                border: OutlineInputBorder(),
                labelText: 'Title',
                hintText: 'What will you call your grocery list?'),
          ),
          Row(
            children: <Widget>[
              Text(
                'Remind me every ',
                style: GoogleFonts.biryani(fontSize: 15.0),
              ),
              new DropdownButton<String>(
                value: 'Wednesday',
                items: <String>[
                  'Sunday',
                  'Monday',
                  'Tuesday',
                  'Wednesday',
                  'Thursday',
                  'Friday',
                  'Saturday'
                ].map((String value) {
                  return new DropdownMenuItem<String>(
                    value: value,
                    child: new Text(value),
                  );
                }).toList(),
                onChanged: (_) {},
              ),
            ],
          )
        ],
      ),
    )

此外，此代码位于与文件主页分开的 class 内，这也是一个有状态小部件。基本上，我最终会得到两个有状态的小部件，主页和此页面，它不会让我创建两个状态。这是它给我的错误：

The name 'createState' is already defined.
Try renaming one of the declarations.dartduplicate_definition

Answer 1

您正在对下拉按钮中的值参数进行硬编码，因此它永远不会改变。您需要在有状态小部件的开头创建一个变量 class 并像这样初始化

String value = "Wednesday";

您需要更改 DropdownButton 的值 onChanged 函数并调用 setState 以使用新值更新 Ui。这就是您的有状态小部件 class 的样子

class _MyHomePageState extends State<MyHomePage> {
  String value = "Wednesday";
 
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Container(
      padding: EdgeInsets.fromLTRB(10.0, 20.0, 10.0, 30.0),
      child: Column(
        children: <Widget>[
          Row(
            children: <Widget>[
              new DropdownButton<String>(
                value: value,
                items: <String>[
                  'Sunday',
                  'Monday',
                  'Tuesday',
                  'Wednesday',
                  'Thursday',
                  'Friday',
                  'Saturday'
                ].map((String value) {
                  return new DropdownMenuItem<String>(
                    value: value,
                    child: new Text(value),
                  );
                }).toList(),
                onChanged: (val) {
                  setState((){
                    this.value = val;
                  });
                },
              ),
            ],
          )
        ],
      )));
  }
}

Answer 2

您必须在 DropdownButton 之外声明一个变量并将所选值设置为该变量。

这是一个示例

String _currentValue='Saturday';

 body: Container(
  padding: EdgeInsets.fromLTRB(10.0, 20.0, 10.0, 30.0),
  child: Column(
    children: <Widget>[
      TextField(
        controller: myController,
        decoration: InputDecoration(
            border: OutlineInputBorder(),
            labelText: 'Title',
            hintText: 'What will you call your grocery list?'),
      ),
      Row(
        children: <Widget>[
          Text(
            'Remind me every ',
            style: GoogleFonts.biryani(fontSize: 15.0),
          ),
          new DropdownButton<String>(
            value: _currentValue,
            items: <String>[
              'Sunday',
              'Monday',
              'Tuesday',
              'Wednesday',
              'Thursday',
              'Friday',
              'Saturday'
            ].map((String value) {
              return new DropdownMenuItem<String>(
                value: value,
                child: new Text(value),
              );
            }).toList(),
            onChanged: (_) {
              setState(() {
                  _selectedValue = _;
                });
            },
          ),
        ],
      )
    ],
  ),
)

Answer 3

更新

------------------------

只需使用两个独立且不同的 Stateful 小部件，一个用于页面，一个用于选择器，查看此 dartpad 以更好地了解如何将 StatefulWidget 拆分为两个单独的 StatefulWidgets

https://dartpad.dev/b07af2a7d088caeb312e5fc0cf6c5f10

------------------------

你硬编码了你的“星期三”值，你应该把它放在一个变量中并将它设置在 on changed 方法上，当然所有这些都应该在 StatefulWidget 中完成，因为你正在管理状态

您的有状态小部件

class TestWidget extends StatefulWidget {
  @override
  _TestWidgetState createState() => _TestWidgetState();
}

您所在的州

class _TestWidgetState extends State<TestWidget> {

  //Your String used for defining the selection**
  String _currentSelection = "Wednesday";

  //Your build method    
  @override
  Widget build(BuildContext context) {
    return Scaffold(
        appBar: AppBar(
          title: Text("DropDownSample"),
        ),
        body: Container(
          padding: EdgeInsets.fromLTRB(10.0, 20.0, 10.0, 30.0),
          child: Column(
            children: <Widget>[
              Row(
                children: <Widget>[
                  Text('Remind me every '),
                  DropdownButton<String>(
                    //Don't forget to pass your variable to the current value
                    value: _currentSelection,
                    items: <String>[
                      'Sunday',
                      'Monday',
                      'Tuesday',
                      'Wednesday',
                      'Thursday',
                      'Friday',
                      'Saturday'
                    ].map((String value) {
                      return new DropdownMenuItem<String>(
                        value: value,
                        child: new Text(value),
                      );
                    }).toList(),
                    //On changed update the variable name and don't forgot the set state!
                    onChanged: (newValue) {
                      setState(() {
                        _currentSelection = newValue;
                      });
                    },
                  ),
                ],
              )
            ],
          ),
        ));
  }
}

另请检查为什么在更新变量时应使用 setState ;) https://flutter.dev/docs/development/ui/interactive

选择某些内容时，下拉菜单不会更新（Flutter）

DropDown Menu isn't updating when something is selected(Flutter)

dart

dropdown

flutter