Warning: [antd: Checkbox] `value` is not validate prop, do you mean `checked`?

user_3915410 0
Viewed 5139

I am using antd design with Reactjs. Found this warning but could not trace the issue.

Following code:

<Form.Item>
  {getFieldDecorator('order_receiver', {
      defaultChecked: true,
      rules: [
          {
              required: false,
              message:
                  'Offer!',
          },
      ],
  })(
      <Checkbox className="ps-checkbox">Order Receiver</Checkbox>,
  )}
</Form.Item>
ant-design-pro antd reactjs
2 Answers

You need to add valuePropName prop on the FormItem like below for remove this warning.

<Form.Item name="checkbox" valuePropName="checked">
  {getFieldDecorator('order_receiver', {
      defaultChecked: true,
      rules: [
          {
              required: false,
              message:
                  'Offer!',
          },
      ],
  })(
      <Checkbox className="ps-checkbox">Order Receiver</Checkbox>,
  )}
</Form.Item>
user_33836930

Put valuePropName="checked" in getFieldDecorator instead.

<Form.Item name="checkbox">
  {getFieldDecorator('order_receiver', {
      defaultChecked: true,
      rules: [
          {
              required: false,
              message:
                  'Offer!',
          },
      ],
      valuePropName:"checked"
  })(
      <Checkbox className="ps-checkbox">Order Receiver</Checkbox>,
  )}
</Form.Item>

user_73209550
Related