如何根据 Flutter 中第一个 DropdownButton 的选择加载第二个 DropdownButton？

Question

I have two dropdowns. Now i want to show secocnd dropdown only when first one is selected otherwise it should be hide.how can i do that in this code please anyone help me.

How can I hide/show widgets on basis of dropdown selection

'How can I hide second dropdown until first is choosen?'   

    
       
      @override
      Widget build(BuildContext context) {
        loadDatalistDropexpensetype();
        loadDatalistDropexpensetype1();
        return new Scaffold(
           appBar: AppBar(   'appbar'
            title: Text("DropDown Testing 2"),
          ),
          body: new Column(
            children: <Widget>[
              new DropdownButton(
                items: listDropexpensetype, 'item which are mentioned in function'
                  value: select,
                  hint: Text("select option"),
                  onChanged: (value){
                    print(value.toString());
                    setState(() {
                      select=value;
                    });
                  }
              ),
              Visibility(
                visible: tcVisibility,
                child: new DropdownButton(   'this should onlt show on selection of first'
                  items: listDropexpensetype1,
                  value: selectedexpensetype,
                  hint: Text("select option"),
                  onChanged: (value){
                    print(value.toString());
                    setState(() {
                      selectedexpensetype=value;
                    });
                  }
                ),
              ),
            ],
          ),
          
        );
      }
    }

Answer 1

You can store a temp variable outside of your build function. For example,

String firstDropDownData = "";

In the onChange() function of your first drop-down, simply update the value of "firstDropDownData" and store something relative in it. Once you'll have something in "firstDropDownData", your second dropdown will be rendered automatically in the UI.

Consider wrapping your second drop-down with the following line.

        firstDropDownData != "" ? DropdownButton(
              items: listDropexpensetype1,
              value: selectedexpensetype,
              hint: Text("select option"),
              onChanged: (value){
                print(value.toString());
                setState(() {
                  selectedexpensetype=value;
                });
              }
            ) : Container()

UPDATE:

On your request, here's a full demo code:

String firstDropDownData = "";


@override
      Widget build(BuildContext context) {
        loadDatalistDropexpensetype();
        loadDatalistDropexpensetype1();
        return Scaffold(
           appBar: AppBar(   'appbar'
            title: Text("DropDown Testing 2"),
          ),
          body: Column(
            children: <Widget>[
              DropdownButton(
                items: listDropexpensetype, 
                  value: select,
                  hint: Text("select option"),
                  onChanged: (value){
                    print(value.toString());
                    setState(() {
                      firstDropDownData = value;
                    });
                  }
              ),
              firstDropDownData != "" ? DropdownButton(  
                  items: listDropexpensetype1,
                  value: selectedexpensetype,
                  hint: Text("select option"),
                  onChanged: (value){
                    print(value.toString());
                    setState(() {
                      selectedexpensetype=value;
                    });
                  }
                ) : Container(),
            ],
          ),
          
        );
      }
    }