相当于ng-model的反应

Question

React的新功能,我有一个TextField,我希望将一个值"绑定"它,如果用户在TextField中输入值,我希望它更改值,如果值通过某个API调用更改,则更新TextField.

有办法吗？

Answer 1

您可以使用state和执行此操作onChange.简单示例包括:

<TextField
  onChange={(name) => this.setState({name})}
  value={this.state.name}
/>

TextInput基于变量的更新指南位于文档中.

Answer 2

在 React 中执行此操作的方法是使用state. 这是 JSX 中的示例：

import React from 'react';

export default class MyForm extends React.Component {

  constructor(props) {
    super(props);
    this.state = {
      text: 'default',
      text2: 'default'
    }
  }

  onChange(e) {
    var obj[e.target.name] = e.target.value
    this.setState(obj);
  }

  render() {
    return (
      <div>
        <input type="text" name="text" value={this.state.text} onChange={this.onChange} />
        <input type="text" name="text2" value={this.state.text2} onChange={this.onChange} />
      </div>
    );
  }
}