Question

function Form(props) {
  var objBarCode;
  if (props.record && props.record.type === "STOCK") {
    objBarCode = < TextInput source="barcode" label="Bar Code" / >;
  }
  return (
    < SimpleForm {...props} >
      < TextInput source="item" label="item" validate={[required]} / >
      < TextInput source="name" label="Name" validate={[required]} / >
      < SelectInput
        source="type"
        label="Type"
        validate={[required]}
        choices={[
          { id: "STOCK", name: "Stock" },
          { id: "RMK", name: "Remark" },
          { id: "SVR", name: "Services" }
        ]}
      / >
      {objBarCode}
    < /SimpleForm >
  );
}

我怎样才能实现这样的目标，某些输入仅在某些条件下出现？当条件值改变时，上述代码不会重新呈现。目标是仅在type="STOCK"

时显示Textinput条形码

Answer 1

这并不容易。您必须实现一个自定义输入，它将从redux格式状态获取条件的当前值，并决定相应显示的内容。

我建议您将其创建为包装器或HOC，以便您可以重复使用它。

您还必须浏览Admin-on-rest源代码，以便在redux和redux-form文档中找到有关如何获取值的表单键。

然而，由于这是一种非常常见的情况，我会看到我们可以做些什么来简化：

我们刚刚发布了aor-dependent-input！如果这对你有用，请告诉我们：）

输入基于某些值已更改

1 个答案: