アイテムが特定の基準を満たしている場合は、検証済みの入力を無効にしたいと思います。この場合、製品にプロモーションがある場合です。
理想的には、次のようなことをしたいです:
<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を使用しています。
ベストアンサー1
これは実際には react とはまったく関係ありません。
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}
/>
);
}