Javascript 禁用React Js中的元素

我是react Js的新手，我想根据条件设置禁用一些元素

我的表格中有三个元素，一个选择，两个输入

根据所选项目，必须禁用其中一个输入

这是我的组件代码：

类AddUser扩展了React.Component{ 构造器{ 超级作物； 此.state={ 用户：{ } }; } 渲染{ 如果这个.props.user{ this.state.user=this.props.user； } 回来 类型 类型1 类型2 二者都 类型1% 类型1% } 我看不到onChange处理程序。请尝试：

<select 
  className="form-control" 
  name="CompanyMeetingType" 
  value={this.state.user.type} 
  onChange={(e) => this.setState({ user: { type: e.target.value } })}>
   <option value="1"> type1</option>
   <option value="2">type2</option>
   <option value="3">both</option>
</select>

---

您唯一缺少的是handleSelect函数，该函数处理选择值事件并设置状态。它可以完美地按照您的需要工作。如果您希望预先默认禁用任何输入标记，则只需在状态中传递该值，以便组件呈现该标记时，该标记将被禁用。

您没有任何onChange处理程序…我添加了但禁用仍然不起作用谢谢你的回答但当我为选择禁用设置初始化值时不起作用例如，在渲染函数中，我为值设置1，我希望它使第一个输入禁用，但它不起作用。你必须在选择标记中添加事件侦听器onChange，并调用一个每次都会调用的函数请告诉我您选择了任何选项值，并在其中定义了函数pass e，通过它我们可以获得所选的任何值。作为开发人员视图，添加一些console.log，了解您获得的值。例如，在函数定义之后添加console.log，在呈现和打印所选类型之后添加console.log，以便您知道如何更改ny选项值是否为函数调用，值是否正在更改。代码中存在一些错误，请检查我如何定义构造函数，您需要为构造函数添加右大括号，因为构造函数和呈现是不同的函数，呈现不能在构造函数函数内，在构造函数函数中，您可以使用此选项。状态={user:{}是错误的方法，您应该使用此方法。状态：{user:{}您有太多语法错误，jsx中有一个父标记您没有，在这一行中缺少右大括号。如果您想禁用渲染时的第一个输入，而不选择任何选项，则只需在状态中传递值1

class Application extends React.Component {
constructor(props) {
    super(props);
    this.state = {
        value: '1'
    }
    this.handleSelect = this.handleSelect.bind(this);
}
handleSelect(e) {
    console.log('enter');
    this.setState({
        value: e.target.value
    })
}
render() {
    console.log(this.state.value)
    return ( 
      <div >
        <select value = { this.state.value} onChange = {this.handleSelect} >
         <option value = "" >select value </option>
         <option value = "1" >value 1 </option>
         <option value = "2" >value 2 </option>
         <option value = "3" >both </option>
         </select> 
         <br / >
        <hr / >
        <input type = "text" disabled = {this.state.value == 1 || this.state.value == 3 }/>
        < br / > < br / >
        < input type = "text" disabled = { this.state.value == 2 || this.state.value == 3 }/> 
      < /div>
     );
    }
  }
React.render( < Application / > , document.getElementById('app'))