- 因为Popover的样式不在app的div里面,所以当我们使用deep穿透的时候是不管用的,一般这种情况可以在全局样式中修改;但是大多数时候,大型项目中不可以私自修改全局样式,这种情况怎么办呢?
下面我们来解决这个问题:
<template>
<a-popover v-model:visible="visible" title="Title" trigger="click" overlay-class-name="pops">
<template #content>
<a @click="hide">Close</a>
</template>
<a-button type="primary">Click me</a-button>
</a-popover>
</template>
<script lang="ts">
import { defineComponent, ref } from 'vue';
export default defineComponent({
setup() {
const visible = ref<boolean>(false);
const hide = () => {
visible.value = false;
};
return {
visible,
hide,
};
},
});
</script>
<style scoped lang="less">
.pops {
// 在这里面写样式就可以修改了
}
</style>