還元型を使用している別のフィールドの値に基づいてフィールドを表示/非表示

Question

私は別のフィールドの値に基づいて非表示にしたいフィールドを持っています。このため、私は現行の値だけでなく、フォーム内の他のフィールドの値も取得できるので、警告プロップを使用しています。

現在のフィールドの値とフォームのすべての値を引数として取るカスタムの小道具（警告と似ています）を作成することはできますか？

redux-formを使用して別のフィールドの値に基づいてフィールドを表示/非表示する方法は他にありますか？

Answer 1

これにはFieldsコンポーネントを使用できます。これは、単一のコンポーネントの下のさまざまなフィールドの状態を処理します。

例：

// outside your render() method 
const renderFields = (fields) => (
    <div> 
    <div className="input-row"> 
     <label>Category:</label> 
     <select {...fields.category.input}> 
     <option value="foo">Some option</option> 
     </select> 
    </div> 
    { fields.category.input.value && (
     <div className="input-row"> 
     <label>Sub category</label> 
     <select {...fields.subcategory.input}> 
      <option value="foo">Some other option</option> 
     </select> 
     </div> 
    )} 
    </div> 
) 

// inside your render() method 
<Fields names={[ 'category', 'subcategory' ]} component={renderFields}/>