React 中需要 Antd 單選按鈕

Question

我在反應中使用 antd。 我在 radio.group 中創建了一些收音機。 我想在提交表單時將其設為必填字段。

 <Radio.Group onChange={onChange} value={value}>
      <Radio value={1}>A</Radio>
      <Radio value={2}>B</Radio>
      <Radio value={3}>C</Radio>
      <Radio value={4}>D</Radio>
    </Radio.Group>

Answer 1

您需要使用 Form 組件包裝所有 JSX，並且需要在同一個 Form 中添加一個 Button 組件。 您還需要添加帶有屬性的 Form.Item 以使單選按鈕成為必需的。 所以你的代碼應該是這樣的：

      <Form>
        <Form.Item
          label="radio"
          name="radio"
          rules={[{ required: true, message: "Please select an option!" }]}
        >
          <Radio.Group>
            <Radio value={1}>A</Radio>
            <Radio value={2}>B</Radio>
            <Radio value={3}>C</Radio>
            <Radio value={4}>D</Radio>
          </Radio.Group>
        </Form.Item>
        <Button htmlType="submit">Submit</Button>
      </Form>

PS：Form.Item 組件中的 label 和 name 屬性對於使表單項成為必需項至關重要。