Question

您好，我有父级有状态小部件，它具有点击按钮，我显示了一个底部工作表，其中有下拉菜单。现在状态变量、列表和函数都在父小部件中，当在下拉列表中选择任何选项时，它会调用函数将该变量设置为新值，但它不会反映在屏幕上。当 pop 底部工作表并再次打开它时，它会显示 updated 值。

父母

class PageAssets extends StatefulWidget {
  @override
  _PageAssetsState createState() => _PageAssetsState();
}

class _PageAssetsState extends State<PageAssets> {
OrganisationModel selectedOrganisation; //-----> state variable 
 List<OrganisationModel> lstOrganisation = []; //----> list of values

selectedOrgChanged(OrganisationModel plant) { //----> function which is to call on change 
    if (mounted) {
      setState(() {
        selectedOrganisation = plant;
      });
    }
    loadPlants(plant: selectedOrganisation);
  }

//somewhere in UI
...
IconButton(icon: Icon(Icons.tune),
              onPressed: () async {
                  showModalBottomSheet();
          })

}

自定义下拉按钮

FilterDropDown(
                      title: 'Organization',
                      onOrgChange: (val) {
                        widget.selectedOrgChanged(val);
                      },
                      orgList: widget.lstOrganisation,
                      selectedOrg: widget.selectedOrganisation,
                    )

自定义下拉菜单

class FilterDropDown extends StatelessWidget {
  final OrgBase selectedOrg;
  final List<OrgBase> orgList;
  final OnOrgChange onOrgChange;
  final String title;

  FilterDropDown({
    this.title,
    this.orgList,
    this.selectedOrg,
    this.onOrgChange,
  });

  @override
  Widget build(BuildContext context) {
    final theme = Theme.of(context);
    return Row(
      children: [
        SizedBox(
          width: 10,
        ),
        SizedBox(
          width: 130,
          child: Text(
            title,
            style: theme.textTheme.subtitle2,
          ),
        ),
        Container(
          width: 150,
          height: 55,
          margin: EdgeInsets.symmetric(horizontal: 10, vertical: 5),
          padding: EdgeInsets.symmetric(horizontal: 7, vertical: 2),
          decoration: BoxDecoration(
              color: Color(0xffe4e4eb),
              borderRadius: BorderRadius.circular(10)),
          child: DropdownButton<OrgBase>(
              isExpanded: true,
              icon: Icon(Icons.arrow_drop_down),
              iconSize: 30,
              hint: Text('--Choose--'),
              underline: SizedBox(),
              value: selectedOrg,
              items: orgList
                  .map<DropdownMenuItem<OrgBase>>(
                      (value) => DropdownMenuItem<OrgBase>(
                          value: value,
                          child: Text(
                            value.label,
                            style: theme.textTheme.subtitle1,
                          )))
                  .toList(),
              onChanged: onOrgChange),
        ),
      ],
    );
  }
}

那么我该如何解决这个问题？

Answer 1

在 FilterDropDown 上的 DropdownButton 内，

替换 onChanged: onOrgChange, 和 onChanged: (value) => onOrgChange(value),

如何从子小部件更新父小部件的状态并将其反映在子小部件中？

1 个答案: