1 深度選擇器 - daniel-qa/Vue GitHub Wiki

  • 深度選擇器 (Deep Selector)

用 v::deep

<template>
    <div>
        <Tag color="gold" closable class="custom-gold-tag">gold closable</Tag>
    </div>
</template>

<style scoped>    

/* 使用自定义 class 避免污染全局其他 Tag */
.custom-gold-tag ::v-deep .ivu-icon-ios-close{
    
    color: #ff0000 !important; /* 修改为你想要的颜色 */
    opacity: 1; /* iView 预设可能有些透明度，可以根据需要调整 */
}

</style>

因為權重爭競，所以使用 !import 解決

color: #ff0000 !important
  • p.s
Scoped 穿透：Vue 的 scoped 會在標籤上加上 data-v-xxxx 屬性，
如果不加 /deep/，產生的 CSS 會變成 .ivu-tag-gold[data-v-xxxx] .ivu-icon-ios-close，
但子組件內部的圖標並沒有這個屬性，所以選不中。
⚠️ **GitHub.com Fallback** ⚠️