vue中需要更改调用的组件样式不起作用,需要使用/deep/或者::v-deep

内容分享2个月前发布
2 1 0
全能 AI 聚合平台 免费

一站式接入主流 AI 大模型,支持对话 · 生图 · 生视频,即开即用

ChatGPT Claude Gemini Grok DeepSeek 通义千问 Ollama
AI对话 AI生图 AI视频
免费使用 →

/deep/在vue中的使用
1.未使用前

<style lang="scss" scoped>
.tabs-area {
    margin-top: 20px;
//页面不起作用
    .el-tabs__nav {
      width: 100%;
      background: #F7F7F7;
    }
}
</style>

需更改成

<style lang="scss" scoped>
.tabs-area {
    margin-top: 20px;

    /deep/.el-tabs__nav {
      width: 100%;
      background: #F7F7F7;
    }
}
</style>

如果运行npm run dev时报错Syntax Error: SassError: expected selector.

vue中需要更改调用的组件样式不起作用,需要使用/deep/或者::v-deep

需要改为:

.tabs-area {
    margin-top: 20px;

    ::v-deep.el-tabs__nav {
      width: 100%;
      background: #F7F7F7;
    }
}

© 版权声明

相关文章

1 条评论

  • 头像
    绝育结扎大蟑螂 读者

    不行

    无记录
    回复