颤动中的下拉按钮不会将值切换到所选值答案

【问题标题】：Drop down button in flutter not switching values to the selected value颤动中的下拉按钮不会将值切换到所选值
【发布时间】：2019-01-15 01:58:48
【问题描述】：

我最近开始使用 dart 和 Flutter 进行编程，我的应用程序一切顺利，尽管最近我想添加下拉菜单来为用户提供多种选择。一切都按计划进行，但是当我从列表中选择一个值时，它不会更改框中的值，它会返回到提示或空框。任何帮助将不胜感激！

这是我的下拉按钮代码：

Widget buildDropdownButton() {
String newValue;

return new Padding(
  padding: const EdgeInsets.all(24.0),
  child: new Column(
    mainAxisAlignment: MainAxisAlignment.start,
    children: <Widget>[
      new ListTile(
        title: const Text('Frosting'),
        trailing: new DropdownButton<String>(
            hint: Text('Choose'),
            onChanged: (String changedValue) {
              newValue=changedValue;
              setState(() {
                newValue;
                print(newValue);
              });
            },
            value: newValue,
            items: <String>['None', 'Chocolate', 'Vanilla', 'ButterCream']
                .map((String value) {
              return new DropdownMenuItem<String>(
                value: value,
                child: new Text(value),
              );
            }).toList()),
      ),
    ],
  ),
);
}

【问题讨论】：

你能把你的有状态小部件放进去吗？

标签： dart flutter flutter-layout

【解决方案1】：

错误是因为您声明了一个方法变量newValue，您必须在您的StatefulWidget 中将该变量声明为全局变量。

   String newValue;

  Widget buildDropdownButton() {
  return new Padding(
    padding: const EdgeInsets.all(24.0),
    child: new Column(
      mainAxisAlignment: MainAxisAlignment.start,
      children: <Widget>[
        new ListTile(
          title: const Text('Frosting'),
          trailing: new DropdownButton<String>(
              hint: Text('Choose'),
              onChanged: (String changedValue) {
                newValue=changedValue;
                setState(() {
                  newValue;
                  print(newValue);
                });
              },
              value: newValue,
              items: <String>['None', 'Chocolate', 'Vanilla', 'ButterCream']
                  .map((String value) {
                return new DropdownMenuItem<String>(
                  value: value,
                  child: new Text(value),
                );
              }).toList()),
        ),
      ],
    ),
  );
  }

【讨论】：

您好！我想问你，为什么我们不能在方法内部声明一个变量？为什么要全局声明变量？
@datafile4 因为如果您更改，该全局值将被保留。如果你在本地定义它，那么如果你返回你的小部件，它的值为 null

【解决方案2】：

面临同样的问题，但没有一个答案有效。然后，我在我的一个旧项目中找到了解决方案。

我在 AlertDialog 这里使用它。

所以，将DropdownButton 更改为DropdownButtonFormField

并添加 onSaved 与 onChanged 完全相同：

onSaved: (value) {
    setState(() {
        _selectedValue = value;
    });
}

就是这样。它将开始工作。

【讨论】：

这是唯一对我有用的解决方案，感谢 Lalit，即使使用 onChange 将 DropdownButton 更改为 DropdownButtonFormField 后它也确实有效

【解决方案3】：

虽然我已经在使用上面的解决方案，但我遇到了这个问题。

对于遇到此问题且上述解决方案不起作用的任何人，请尝试将 FutureBuilder 从下拉列表中分离出来。这就是你的最终代码的样子：

class TheFuture extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return FutureBuilder(
      future: myFuture(),
      builder: (ctx, snp) {
        if (!snp.hasData) return LoadingLine();
        return TheBuilder(snp.data);
      },
    );
  }
}

class TheBuilder extends StatefulWidget {
  const TheBuilder(this.mp);
  final Map<String, dynamic> mp;
  @override
  _MessageUSScreenFilterBodyState createState() =>
      _MessageUSScreenFilterBodyState();
}

class _MessageUSScreenFilterBodyState extends State<MessageUSScreenFilterBody> {
  int _selectedId;

  @override
  Widget build(BuildContext context) {
    return DropdownButton<int>(
      selectedItemBuilder: (context) =>
          widget.mp['myData'].map((e) => Text(e.type)).toList(),
      items: widget.mp['myData']
          .map(
            (e) => DropdownMenuItem(
              child: Text(e.type),
              value: e.id,
            ),
          )
          .toList(),
      value: _selectedId,
      onChanged: (int _id) {
        setState(() {
          _selectedId = _id;
        });
      },
    );
  }
}

【讨论】：

【解决方案4】：

使用 StatefulBuilder 包装下拉按钮并在构建方法之外初始化 newValue。

  StatefulBuilder(
          builder: (context, setState) => AlertDialog(
            title: Text("Change Status"),
            content: Container(
              padding: EdgeInsets.symmetric(horizontal: 8.0),
              decoration: BoxDecoration(
                  border: Border.all(color: Colors.grey, width: 1),
                  borderRadius: BorderRadius.circular(5)),
              child: DropdownButtonHideUnderline(
                child: DropdownButton(
                    hint: Text('Choose'),
                    onChanged: (String changedValue) {
                      setState(() {
                        newValue = changedValue;
                        print(newValue);
                      });
                    },
                    value: newValue,
                    items: <String>[
                      'None',
                      'Chocolate',
                      'Vanilla',
                      'ButterCream'
                    ].map((String value) {
                      return new DropdownMenuItem<String>(
                        value: value,
                        child: new Text(value),
                      );
                    }).toList()),
              ),
            ),
            
          ),
        ));

【讨论】：