vue多个元素的样式选择器问题

三目运算符只能进行两个的选择判断,多个选择就很难受了。

创新互联建站是一家从事企业网站建设、网站建设、成都网站制作、行业门户网站建设、网页设计制作的专业网络公司,拥有经验丰富的网站建设工程师和网页设计人员,具备各种规模与类型网站建设的实力,在网站建设领域树立了自己独特的设计风格。自公司成立以来曾独立设计制作的站点1000多家。

废话少说,直接上源码。

首先获取它的索引,通过索引来判断样式

// 索引key判断
我是什么颜色

在data里面定义元素的样式 数组格式

// 数组格式
data() {
    return {
      rcar:[
        "rcar",
        "rcar2",
        "rcar3",
        "rcar4",
        "rcar5",
      ]
    };

下面就是css写自己的样式了

// 自己的样式
.rcar {
  background-color: #1388ef;
}
.rcar2 {
  background-color: #a0a0a0;
}
.rcar3 {
  background-color: #282828;
}
.rcar4 {
  background-color: #efc313;
}
.rcar5 {
  background-color: #b9bab9;
}

总结

以上所述是小编给大家介绍的vue多个元素的样式选择器问题,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对创新互联网站的支持!
如果你觉得本文对你有帮助,欢迎转载,烦请注明出处,谢谢!


文章题目:vue多个元素的样式选择器问题
分享路径:http://hxwzsj.com/article/gsopdp.html

其他资讯

Copyright © 2025 青羊区翔捷宏鑫字牌设计制作工作室(个体工商户) All Rights Reserved 蜀ICP备2025123194号-14
友情链接: 成都网站建设公司 阿坝网站设计 成都网站建设 成都网站设计公司 成都网站建设推广 成都网站设计制作公司 古蔺网站建设 手机网站制作 成都定制网站建设 企业手机网站建设 网站建设公司 成都网站制作 泸州网站建设 成都网站设计 成都商城网站制作 网站设计制作报价 成都网站建设 成都网站建设 成都网站设计 成都网站制作 重庆网站制作 企业网站制作