对话框中的Flutter Redux DropdownButton

时间:2018-11-12 22:34:18

标签: redux flutter

在flutter_redux中,如何使用StoreConnector在对话框中创建一个DropdownButton?

我在有状态的小部件中有一个对话框,以便当DropdownButton更改时,它会再次更新以呈现。

切换到Redux,我创建了两个StoreConnector,一个用于所选值,一个用于state.dispatch回调。

我必须将此代码添加到构建器中:

if(_selectedId == null) {
  _selectedId = size;
}

如果不存在,则下拉列表不会更改,因为它始终具有redux状态值,或者即使位于下拉菜单中也不会显示redux状态值。

Widget build(BuildContext context) {
    return SimpleDialog(
      title: new Text("User Settings"),
      children: <Widget>[
      // Redux store connector, to listen on state.size only, not entire state
      StoreConnector<AppState, dynamic>(
        converter: (store) => store.state.size,
        builder: (context, size) {
          if(_selectedId == null) {
            _selectedId = size;
          }
          print("prior to container: ${_selectedId}");
          return new Container(
              padding: const EdgeInsets.all(10.0),
              child: new DropdownButton<String>(
                hint: const Text("Select your size"),
                value: _selectedId,
                onChanged: (String changedValue) {
                  // this sets State for the parent widget, the dialog, so the
                  // dropdown runs it's render. It has nothing to do with
                  // redux, only updating the dropdown value
                  setState(() {
                    _selectedId = changedValue;
                    print(changedValue);
                    print(_selectedId);
                  });
                },
                items: _sizes,
              )
          );
        } // builder
      ),
      // need a second store connector, for dispatch ChangeSize action
      StoreConnector<AppState, dynamic>(
        converter: (store) {
          return (size) => store.dispatch(ChangeSize(_selectedId));
        },
        builder: (context, callback) {
          return new SimpleDialogOption(
            onPressed: () {
              // StoreConnector callback
              callback(_selectedId);
              // close dialog
              Navigator.pop(context);
            },
            child: const Text('Close'),
          );
        }  // builder
      )
      ],
    );
  } //widget build

0 个答案:

没有答案