使用材料ui选择和'redux-form'的意外行为

Question

我有一个简单的'redux form'，带有来自最新材料的Select组件-ui-next。

import { TextField } from 'material-ui';

<Field
   name="name"
   component={TextField}
   select
>
   <MenuItem value={1}>Lily</MenuItem>
   <MenuItem value={2}>Mark</MenuItem>
</Field>

工作良好。 Hovewer，如果我将value道具从number类型更改为string，例如

<Field
   name="name"
   component={TextField}
   select
>
   <MenuItem value="lily">Lily</MenuItem>
   <MenuItem value="mark">Mark</MenuItem>
</Field>

值正确地改变，但是在一秒之后，该值变为0（最初），并且所选值消失（从现在开始它是空的）。它有一个正确的价值只是片刻，但不知何故，它会自动回到0。

甚至尝试渲染该领域：

const renderSelectField = ({ input, label, meta: { touched, error }, children, ...custom }) => (
  <TextField
    {...input}
    select
    onChange={(event, index, value) => input.onChange(event.target.value)}
    children={children}
    {...custom}
  />
)

不过，它改变了价值，之后它又回到了0。如果我console.log表单值，它显示（手动更改值后）：

{ name: "Lily" }
{ name: 0 }
{ name: 0 }

（它发生在一秒钟内）

期待任何帮助。谢谢。

编辑：当使用string值选择项目时，在redux dev工具中会发生这种情况 - 在本例中为pln。

Answer 1

基于这个react-select issue和这个redux-form issue，你似乎需要覆盖默认的onBlur事件。