材质UI TextField自定义属性

Question

我目前正在尝试将自定义数据属性设置为TextField组件，例如：

class TestTextField extends React.Component {
componentDidMount() {console.log(this._input)}
  render() {
    return (
      <TextField
        label="Label 1"
        InputProps={{placeholder: 'Input 1', 'data-state': 'Data State 1'}}
        margin="normal"
        inputRef={(elem) => {this._input = elem}}
      />
    )
  }
}

但是我无法data-state出现在控制台日志中

 <textarea rows="1" class="MuiTextarea-textarea-67 MuiInput-input-56 MuiInput-inputMultiline-64" placeholder="Input 1" type="text">

TextField不支持自定义属性吗？我正在使用v1.0.0-beta.6（https://material-ui-1dab0.firebaseapp.com/api/text-field/）

Answer 1

如果其他人没有注意到，@pier-paolo-ramon 是说使用inputProps道具而不是InputProps道具。密切注意区分大小写。

<TextField
  inputProps={{placeholder: 'Input 1', 'data-state': 'Data State 1'}}
/>

Answer 2

如您所见，自定义道具传递到FormControl组件。你想要什么是很可能inputProps，然后向下传递到实际的<input />（InputComponent是"input"默认）