颤动:下拉项目以编程方式取消选择问题

我在这里使用了两个下拉菜单。

这两个数据都来自 API。第二个数据取决于第一个下拉项。这意味着当我从第一个菜单中选择一个项目时,数据将出现在第二个下拉菜单中。而且它是动态变化的。

我在这里遇到了问题。当我从第一个下拉列表更改项目时,第二个下拉列表显示错误。 像这样 -

之前

颤动:下拉项目以编程方式取消选择问题

更改城市值后

颤动:下拉项目以编程方式取消选择问题

这是我的两个下拉代码

   // Choose City
            CustomDropDownmenu(
              items: allCity.map((list) {
                return DropdownmenuItem(
                  child: Padding(
                    padding: const EdgeInsets.only(left: 20.0),child: Text(
                      "${list["name"]}",style: TextStyle(),),onTap: () {
                    setState(() {
                      isVisible = false;
                    });

                    getWeight(list["id"]).then((value) => {
                          setState(() {}),});
                    print(list["id"]);
                    FocusScope.of(context).unfocus();
                    print(weightList.length);
                  },value: list["id"].toString(),);
              }).toList(),value: _city,hint: "Choose City",onChanged: (value) {
                setState(() {
                  this._city = value;
                });
              },// Weight
 CustomDropDownmenu(
              hint: "Select Weight",value: _weight,items: [
                DropdownmenuItem(child: Text("Select Weight")),...weightList.map((list) {
                  return DropdownmenuItem(
                    child: Padding(
                      padding: const EdgeInsets.only(left: 20.0),child: Text(
                        "${list["weight"]}",onTap: () {
                      FocusScope.of(context).unfocus();
                    },);
                }).toList()
              ],onChanged: (value) {
                setState(() {
                  _weight = value;
                });
              },

这是CustomDropDown()

.. class CustomDropDownmenu extends StatelessWidget {   final String hint;   final dynamic value;

  final Function onChanged;   final Function onSaved;   final List<DropdownmenuItem<dynamic>> items;

  const CustomDropDownmenu({
    Key key,this.hint,this.onChanged,this.onSaved,this.items,this.value,}) : super(key: key);   @override   Widget build(BuildContext context) {
    double _width = MediaQuery.of(context).size.width;
    return Container(
        decoration: BoxDecoration(
          shape: BoxShape.rectangle,borderRadius: BorderRadius.all(
            Radius.circular(60),child: Card(
          shape: StadiumBorder(),elevation: 5,child: DropdownButtonFormField(
            style: TextStyle(
                fontWeight: FontWeight.bold,fontSize: 18.0,color: Colors.black),hint: Padding(
              padding: const EdgeInsets.only(left: 20.0),child: Text(
                hint,textAlign: TextAlign.end,decoration: InputDecoration(
              enabledBorder: UnderlineInputBorder(
                borderSide: BorderSide(color: Colors.transparent),value: value,onChanged: onChanged,onSaved: onSaved,items: items,));   } }

这就是为什么我想以编程方式取消选择下拉菜单项上的第二个,但找不到解决方案。请有人帮助我。

crystalrainss 回答:颤动:下拉项目以编程方式取消选择问题

在城市变化时设置 _weightnull

,

将您的 CustomDropDownMenu 转换为有状态的小部件并实现以下代码:

  @override
 void didUpdateWidget(covariant AppDropDown oldWidget) {
   super.didUpdateWidget(oldWidget);
   if (!listEquals(oldWidget.items,widget.items)) {
      value = null;
   }

}

本文链接:https://www.f2er.com/1098273.html

大家都在问