antd：作为卡片的单选按钮

Question

我想创建具有单选按钮功能的卡片，单击卡片时应将其显示为“已选择”并从之前选择的卡片中删除“选择”。

知道怎么做吗？

我正在使用 antd 组件。

提前致谢，如果您需要任何额外的代码片段，请告诉我。

Answer 1

AntD Radio.Button 接受 children 所以你可以尝试给它一个 Card 组件。

我用自定义图标做了类似的事情

  <Radio.Group
    size="large"
    buttonStyle="solid"
    className="large-icons"
  >
    <Radio.Button value="Canine">
        <CustomIcon type="cute-dog" />
        Canine
    </Radio.Button>
    <Radio.Button value="Feline">
        <CustomIcon type="nice-cat" />
        Feline
    </Radio.Button>
  </Radio.Group>

antd：作为卡片的单选按钮

antd: Radio buttons as cards

javascript

antd