使用redux-form根據另一個字段的值顯示/隱藏字段

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}/>