如果某个项目满足特定条件，我想禁用经过验证的输入。在这种情况下，如果产品有促销事件。

理想情况下我想做这样的事情:

<ValidatedInput 
  className='product-dropdown' 
  onChange={this.onProductChange.bind(this)} 
  defaultValue={example.product_id} 
  componentClass='select' 
  name='product_id' 
  placeholder='select' 
  disabled={isDisabledInput} 
 > 
 
isDisabledInput { 
  if(example.has_a_promotion) { 
     return true 
  } 
} 

我正在使用react-bootstrap-validation。

请您参考如下方法:

这实际上与 React `per-say 无关。

我已更改example以使用组件state，这意味着只要状态更改，ValidatedInput就会重新呈现。如果渲染组件时 example.has_a_promotion 正确，这实际上可能不是必需的。所以请相应地改变。

disabled 实际上只是一个向下传递给 ValidatedInput 组件的属性。这意味着它的值就像用 {} 包装时运行的任何其他 js 一样...因此一个简单的 if 语句就可以解决问题。

 render(){ 
  return(     
     <ValidatedInput 
       className='product-dropdown' 
       onChange={this.onProductChange.bind(this)} 
       defaultValue={example.product_id} 
       componentClass='select' 
       name='product_id' 
       placeholder='select' 
       disabled={this.state.example.has_a_promotion === true ? true : false} 
      /> 
   ); 
 }