ReactJS和禁用/启用选定字段

class MyForm extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      isFieldEnabled: true
    };
  }

  render() {
    return (
      <form>
        <input type="text" disabled={!this.state.isFieldEnabled} />
        <button onClick={() => this.setState({ isFieldEnabled: !this.state.isFieldEnabled })}>
          {this.state.isFieldEnabled ? '禁用字段' : '启用字段'}
        </button>
      </form>
    );
  }
}

class MyForm extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      isFieldVisible: true
    };
  }

  render() {
    return (
      <form>
        {this.state.isFieldVisible && <input type="text" />}
        <button onClick={() => this.setState({ isFieldVisible: !this.state.isFieldVisible })}>
          {this.state.isFieldVisible ? '隐藏字段' : '显示字段'}
        </button>
      </form>
    );
  }
}