ant-design-vue checkbox复显

根据引用和引用提供的信息，你可以通过修改CSS样式来自定义ant-design-vue的checkbox组件。你可以使用以下代码来修改checkbox的默认样式、鼠标hover时的样式以及选中时的样式:

.ant-checkbox-wrapper:hover .ant-checkbox-inner, .ant-checkbox:hover .ant-checkbox-inner, .ant-checkbox-input:focus .ant-checkbox-inner {
  border: 2px solid #1BBA79 !important;
}
.ant-checkbox {
  .ant-checkbox-inner {
    border: 2px solid #1BBA79;
    background-color: transparent;
  }
}
.ant-checkbox-checked .ant-checkbox-inner, .ant-checkbox-indeterminate .ant-checkbox-inner {
  background-color: #1BBA79;
  border: 2px solid #1BBA79;
}

如果你只想修改特定的checkbox组件，你可以给它添加一个类名，比如"test"，然后在CSS中使用类选择器来修改该组件的样式。例如，你可以使用以下代码来修改具有类名"test"的checkbox组件的样式:

.ant-checkbox[data-v-a49090ce].test {
  .ant-checkbox-inner {
    border: 2px solid #1BBA79;
    background-color: transparent;
  }
}

引用提到，如果你在checkbox中使用了`:value`属性而不是`:defaultValue`属性，那么选中的checkbox将无法再更改。你可以使用`:defaultValue`属性来表示初始默认值，并根据需要进行更改选择。

下面是一个关于ant-design-vue checkbox的基本用法的例子：

<template>
  <a-checkbox @change="onChange">Checkbox</a-checkbox>
</template>
<script>
export default {
  methods: {
    onChange(e) {
      console.log(`checked = ${e.target.checked}`);
    },
  },
};
</script>

你可以根据自己的需求，按照以上方式对ant-design-vue的checkbox进行自定义样式和复显设置。<span class="em">1</span><span class="em">2</span><span class="em">3</span>
#### 引用[.reference_title]
- *1* [ant-design-vue修改input和checkbox的组件样式](https://blog.csdn.net/weixin_45803990/article/details/116398126)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v92^chatsearchT3_1"}}] [.reference_item style="max-width: 33.333333333333336%"]
- *2* [ant-design-vue修改checkbox的组件样式。](https://blog.csdn.net/pipizhou16/article/details/125150151)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v92^chatsearchT3_1"}}] [.reference_item style="max-width: 33.333333333333336%"]
- *3* [ant-design-vue checkbox checked不生效](https://blog.csdn.net/qq_36987708/article/details/116460345)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v92^chatsearchT3_1"}}] [.reference_item style="max-width: 33.333333333333336%"]
[ .reference_list ]