Unknown Prop with React，如何创建新的 html 属性

Question

我正在尝试在我的收音机和复选框的输入元素上创建 :indeterminate 属性。

我有以下反应抛出的错误：

Unknown prop `indeterminate` on <input> tag. Remove this prop from the element

是否可以创建新道具或是否已完全锁定？

Answer 1

只需将输入包装到另一个可以接受 indeterminate 属性的组件中：

const IndeterminateInput = React.createClass({
  render() {
    // Create props clone
    const cleanProps = Object.assign({}, this.props);
    delete cleanProps['indeterminate'];
    return <input ref="input" {...cleanProps}/>
  },
  updateInput: function () {
    this.refs.input.indeterminate = Boolean(this.props.indeterminate);
  },
  componentDidMount() {
    // Initial render
    this.updateInput();
  },
  componentDidUpdate() {
    // Props change
    this.updateInput();    
  } 
});

那么你可以使用这个组件作为包装器：

<IndeterminateInput type="checkbox" indeterminate />

请注意，即使在 HTML 中，indeterminate 也不是有效属性。您必须手动更新 DOM：

<!-- This does not work! -->
<input type="checkbox" indeterminate>

Unknown Prop with React，如何创建新的 html 属性

Unknown Prop with React, how to create new html property

javascript

reactjs

react-proptypes