Javascript 将材质ui ToggleButtonGroup连接到redux表单

我正在尝试将材质ui与redux表单连接起来，并由此产生问题。 这是我的密码：

<Field
  name='operator'
  component={FormToggleButtonGroup}
>
  <ToggleButton value='equals'>Equal</ToggleButton>
  <ToggleButton value='not_equals'>Not equal</ToggleButton>
</Field>

相等的
不相上下

。。和我的组件，传递到字段：

const FormToggleButtonGroup = (props) => {
  const {
    input,
    meta,
    children
  } = props;

  return (
    <ToggleButtonGroup
      {...input}
      touched={meta.touched.toString()}
    >
      {children}
    </ToggleButtonGroup>
  );
};

export default FormToggleButtonGroup;

常量FormToggleButtongGroup=（道具）=>{
常数{
输入，
元，
儿童
}=道具；
返回(
{儿童}
);
};
导出默认FormToggleButtongGroup；

问题是，当我选择值（切换选项）时，所选值不会传递到redux存储，它仅在失去焦点后传递，然后抛出错误“newValue.splice不是函数” 请帮助处理这个问题

---

我终于找到了解决方案。 我需要手动分配从ToggleButtonGroup组件获得的新值，并将该值放入redux存储。以下是工作代码的外观：

const FormToggleButtonGroup = (props) => {
  const {
    input,
    meta,
    children,
    ...custom
  } = props;

  const { value, onChange } = input;
  return (
    <ToggleButtonGroup
      {...custom}
      value={value}
      onChange={(_, newValue) => {
        onChange(newValue);
      }}
      touched={meta.touched.toString()}
    >
      {children}
    </ToggleButtonGroup>
  );
};

const FormToggleButtonGroup=（props）=>{
常数{
输入，
元，
儿童
…习俗
}=道具；
const{value，onChange}=输入；
返回(
{
onChange（newValue）；
}}
toucted={meta.toucted.toString（）}
>
{儿童}
);
};

主要的变化是获得redux的onChange函数，并使用新值调用它，该值在切换值时被选中。有一个onChange与ToggleButtonGroup组件相关，另一个onChange与Redux相关。当ToggleButtonGroup的onChange发生时，需要调用后者