vue v-for 样式赋值
来源:互联网 发布:考勤管理系统源码 编辑:程序博客网 时间:2024/05/17 01:52
<span v-for="item in data2Source">
<div class="col-md-3 col-sm-3 col-xs-3">
<span class="iconSize" v-if="item.icon === ''">
<i class="el-icon-news" v-if="item.iconColor === ''" style="background-color: #3EBAEC;"></i>
<i class="el-icon-news" v-else v-bind:style="{'background-color': item.iconColor}"></i>
<font>{{item.name}}</font>
</span>
<span class="iconSize" v-else>
<i :class="item.icon" v-if="item.iconColor === ''" style="background-color: #3EBAEC;"></i>
<i :class="item.icon" v-else v-bind:style="{'background-color': item.iconColor}"></i>
<font>{{item.name}}</font>
</span>
</div>
<div class="col-md-3 col-sm-3 col-xs-3">
<span class="iconSize" v-if="item.icon === ''">
<i class="el-icon-news" v-if="item.iconColor === ''" style="background-color: #3EBAEC;"></i>
<i class="el-icon-news" v-else v-bind:style="{'background-color': item.iconColor}"></i>
<font>{{item.name}}</font>
</span>
<span class="iconSize" v-else>
<i :class="item.icon" v-if="item.iconColor === ''" style="background-color: #3EBAEC;"></i>
<i :class="item.icon" v-else v-bind:style="{'background-color': item.iconColor}"></i>
<font>{{item.name}}</font>
</span>
</div>
</span>
直接上代码吧! v-bind:style="{'background-color': item.iconColor}" 为样式赋值,将获取的json 样式赋值给style
阅读全文
0 0
- vue v-for 样式赋值
- Vue用v-for给src属性赋值
- vue v-for v-if
- vue v-for 数据处理
- vue v-for详解
- vue v-for 嵌套
- Vue常用指令v-for
- vue的v-for使用
- Vue v-for 的反面教材。
- vue v-for数组倒序
- vue.js之v-for
- vue v-for 循环对象
- Vue实践--V-for指令
- VUE指令-样式绑定v-bind
- VUE条件渲染(v-if v-show v-for)
- vue学习01--v-bind:title/v-if/v-for
- Vue.js实践-v-for注意事项
- vue.js列表输出v-for
- 小结
- 我为什么要写blog
- 小码侬修仙之路
- java基础:代码块、继承
- JVM四种垃圾回收机制
- vue v-for 样式赋值
- 向上取整算法
- Flask学习(四):数据库迁移
- 解决xftp远程连接后出现中文乱码的问题
- PMP笔记-项目范围管理知识点汇总
- 优酷土豆实时推荐系统架构升级实践
- 【算法】【Dynamic Programming】Wiggle Subsequence
- js工具类
- proc