颤动中下拉菜单中的状态是不是存在问题

Posted

技术标签:

【中文标题】颤动中下拉菜单中的状态是不是存在问题【英文标题】:Problem if state in DropDown menu in flutter颤动中下拉菜单中的状态是否存在问题 【发布时间】:2021-07-03 17:20:24 【问题描述】:

我在管理下拉菜单的状态时遇到问题,

我有两个下拉菜单,第二个的项目是根据第一个中选择的项目构建的。

当我再次更改第一个选项时,我的问题是清理第二个。

如果我更新第一个的值,我当时尝试将第二个的值设置为 null,但即使它仍然存在问题。

import 'package:flutter/material.dart';
import 'package:flutter_mobx/flutter_mobx.dart';
import 'package:mobicar/app/stores/brand_store.dart';
import 'package:mobicar/app/stores/vehicle_store.dart';

class HomePage extends StatefulWidget 
  HomePage(Key? key) : super(key: key);

  @override
  _HomePageState createState() => _HomePageState();


class _HomePageState extends State<HomePage> 
  var brandStore = BrandStore();
  var vehicleStore = VehicleStore();
  var selectedBrand;
  var selectedVehicle;

  @override
  void initState() 
    brandStore.getBrands().then((value) );
    super.initState();
  

  @override
  Widget build(BuildContext context) 
    return Scaffold(
      appBar: AppBar(),
      body: _body(),
    );
  

  Column _body() 
    return Column(
      children: [
        Row(
          mainAxisAlignment: MainAxisAlignment.end,
          children: [
            GestureDetector(
              onTap: () => _newItemDialog(),
              child: Container(
                margin: EdgeInsets.only(top: 5, right: 5),
                padding: EdgeInsets.all(8),
                decoration: BoxDecoration(
                  color: Colors.black,
                  borderRadius: BorderRadius.all(Radius.circular(8)),
                ),
                child: Text(
                  "new",
                  style: TextStyle(color: Colors.white),
                ),
              ),
            ),
          ],
        ),
        Expanded(
            child: ListView(
          children: [Text("Supervisor, selecione a viatura")],
        ))
      ],
    );
  

  Future _newItemDialog() 
    return showDialog(
        barrierDismissible: false,
        context: context,
        builder: (context) => Container(
              child: AlertDialog(
                title: Row(
                  mainAxisAlignment: MainAxisAlignment.spaceBetween,
                  children: [
                    Text("Novo Veiculo "),
                    IconButton(
                        icon: Icon(Icons.close),
                        onPressed: () => Navigator.pop(context))
                  ],
                ),
                content: Observer(builder: (_) 
                  return Column(
                    mainAxisSize: MainAxisSize.min,
                    children: [
                      Image.asset("assets/images/car.png"),
                      _dropdownButton(
                          hint: "Marca",
                          itemlist: _dropDownItemBrands,
                          type: 'brand'),
                      _dropdownButton(
                          hint: "Modelo",
                          itemlist: _dropDownItemVehicles,
                          type: 'vehicle'),
                      _dropdownButton(
                          hint: "Ano", itemlist: _dropDownItemBrands, type: ''),
                    ],
                  );
                ),
                backgroundColor: Colors.white,
                shape: RoundedRectangleBorder(
                  borderRadius: BorderRadius.circular(26),
                ),
              ),
            ));
  

  _dropdownButton(required hint, required itemlist, required type) 
    return Container(
      margin: EdgeInsets.only(top: 10),
      child: DropdownButtonFormField(
        hint: Text(hint),
        items: itemlist() ?? [],
        onChanged: (value) 
          switch (type) 
            case 'brand':
              vehicleStore.getVehicles(value);
              break;
            case 'vehicle':
              selectedVehicle = value;
              break;
            default:
          
        ,
        decoration: InputDecoration(
          contentPadding: EdgeInsets.only(left: 8, right: 0, top: 0, bottom: 0),
          border: OutlineInputBorder(borderRadius: BorderRadius.circular(4)),
        ),
      ),
    );
  

  List<DropdownMenuItem<int>> _dropDownItemBrands() 
    List<DropdownMenuItem<int>> list = [];
    if (brandStore.brandList.isNotEmpty) 
      brandStore.brandList.forEach((element) 
        list.add(
          DropdownMenuItem<int>(
            child: Text(
              element.name,
              style: TextStyle(color: Colors.black),
            ),
            value: element.id,
          ),
        );
      );
      return list;
     else 
      return list;
    
  

  List<DropdownMenuItem<int>> _dropDownItemVehicles() 
    List<DropdownMenuItem<int>> list = [];
    if (brandStore.brandList.isNotEmpty) 
      vehicleStore.vehiclesList.forEach((element) 
        list.add(
          DropdownMenuItem<int>(
            child: Text(
              element.name,
              style: TextStyle(color: Colors.black),
            ),
            value: element.id,
          ),
        );
      );
      return list;
     else 
      return list;
    
  



【问题讨论】:

【参考方案1】:

当您想更改clean 用户界面上第二个下拉菜单的值时,您必须使用setState

所以,

如果我更新,我当时尝试将秒的值设置为 null 第一个的值,但即使它仍然存在问题。

将其设置为null 或空列表[],但在setState 内部:

//instead of yourSecondValue == null, use:
setState(() 
yourSecondValue == null;
);

这是假设将其设置为 null 会真正解决问题。

【讨论】:

以上是关于颤动中下拉菜单中的状态是不是存在问题的主要内容,如果未能解决你的问题,请参考以下文章

在颤动中使用块和下拉菜单

如何在颤动中将默认值设置为下拉菜单?

AngularJS 中的下拉菜单

Rails表单中的下拉菜单和常量的使用

如何检查 iframe 中的选择下拉菜单是不是更改?

如何检查 Select2 中的下拉菜单是不是打开?