andt多选框(选择x个之后禁用)

const [data, setData] = useState([
   	{ id: 0, name: '小说', disabled: false },
    { id: 1, name: '科幻', disabled: false },
    { id: 2, name: '植物', disabled: false },
    { id: 3, name: '动漫', disabled: false },
    { id: 4, name: '动物', disabled: false },
    { id: 5, name: '玄幻', disabled: false },
])
<Checkbox.Group onChange={onChange}>
   <Row>
        {
            data.map(v => {
                return (
                    <Col span={8} key={v.id}>
                        <Checkbox
                            value={v.name}
                            style={{
                                lineHeight: "32px",
                            }}
                            disabled={v.disabled}
                        >
                            {v.name}
                        </Checkbox>
                    </Col>
                )
            })
        }
    </Row>
</Checkbox.Group>


const onChange = opt => {
    let arr = []
    if (opt.length === 3) {
        arr = data.map(v => {
            if (!opt.includes(v.name)) {
                v.disabled = true
                return v
            }
            return v
        })
    } else {
        arr = data.map(v => {
            v.disabled = false
            return v
        })
    }
    setData(arr)
}