Question

我正在使用react.js创建联系表单，但出现错误； “当电子邮件字段更改时，ContactForm组件应使用更新的联系人数据调用onChanges。”有帮助吗？！

我在contact.jsx文件中收到此错误。不确定如何解决此问题。

上个月的链接：https://rextester.com/LWKDFE70058

我知道解决方法是添加“ this.props.name.onChange（this.props.data）”行，但不确定将其添加到何处。任何帮助将不胜感激？！

Answer 1

您需要将输入字段绑定到数据模型对象。而且，当输入字段的值更改时，还需要将新值设置回对象模型。

例如看看下面的示例代码：

class NameForm extends React.Component {
  constructor(props) {
    super(props);
    this.state = {value: ''};

    this.handleChange = this.handleChange.bind(this);
    this.handleSubmit = this.handleSubmit.bind(this);
  }

  handleChange(event) {
    this.setState({value: event.target.value});
  }

  handleSubmit(event) {
    alert('A name was submitted: ' + this.state.value);
    event.preventDefault();
  }

  render() {
    return (
      <form onSubmit={this.handleSubmit}>
        <label>
          Name:
          <input type="text" value={this.state.value} onChange={this.handleChange} />
        </label>
        <input type="submit" value="Submit" />
      </form>
    );
  }
}

ReactDOM.render(
  <NameForm />,
  document.getElementById('root')
);

联系表格onChange函数调用错误

1 个答案: