您如何在 redux 表单数组中使用离子复选框进行反应？

Question

我正在尝试为数组中的字段合并一个复选框，以确定该项目是否完整。我有点迷路了，但这就是组件现在的样子：

export const ReduxFormStartWorkoutCheckBox: React.FC = (field: any) => {
  console.log(field);
  return (
    <IonCheckbox
      {...field.input}
      value={true}
      checked={
        field.input.value === "true" || field.input.value === true
          ? true
          : false
      }
      name={field.input.name}
      color="primary"
    />
  );
};

这是它的用法：

<Field
  name={`${set}.completed`}
  component={ReduxFormStartWorkoutCheckBox}
  type="checkbox"
/>

但它不起作用。这只是在我选中一个不同的框之后打开复选框，然后它没有关闭，所以我肯定离开了。任何提示都会有所帮助。

Answer 1

对于任何正在挣扎的人，我找到了正确的方法：这是 redux 表单复选框的样子

export const ReduxFormCheckBox: React.FC = (field: any) => (
  <IonButton
    size="small"
    color={field.input.checked ? "success" : "danger"}
    fill="clear"
    onClick={() => field.input.onChange(!field.input.value)}
  >
    <IonIcon
      icon={field.input.checked ? checkmarkCircle : checkmarkCircleOutline}
      slot="icon-only"
    />
  </IonButton>
);

这就是它的名字：

<Field
 name={`${set}.completed`}
 component={ReduxFormCheckBox}
 type="checkbox"
/>

您如何在 redux 表单数组中使用离子复选框进行反应？

How do you use the ionic checkbox in a redux form array in react?

reactjs

ionic4

redux-form