VUE在for循环里面根据内容值动态的加入class值的方法
作者：admin
这篇文章主要介绍了VUE在for循环里面根据内容值动态的加入class值的方法,非常不错，具有一定的参考借鉴价值，需要的朋友可以参考下
最近在做玩家蚂蚁项目的时候遇到了一个评分显示的小功能，这个在前端显示的星星是用class样式来进行控制的
class =” real-star comment-stars-width5 ”
数据库里记录的信息只有一个评分1-5。我们如果用一般的php方法直接在class里面用 comment-stars-width{$score}这样是行不通的。在查了很多资料和做过很多尝试以后，确定了一个可行的方法
我们使用vue的:class来进行class的绑定。:class=”`comment-stars-width`+s.score” 然后把前面需要的属性前缀用 “包裹起来，后面的值用+号连起来，这样渲染出来的数据就是我们想要的数据样式了！
总结
以上所述是小编给大家介绍的VUE在for循环里面根据内容值动态的加入class值的方法，希望对大家有所帮助，如果大家有任何疑问欢迎给我留言，小编会及时回复大家的！
您可能感兴趣的文章:
- VUE2.0+ElementUI2.0表格el-table循环动态列渲染的写法详解
- 实例分析vue循环列表动态数据的处理方法
- VUE v-for循环中每个item节点动态绑定不同函数的实例
- 关于vue v-for循环解决img标签的src动态绑定问题
- vue.js 嵌套循环、if判断、动态删除的实例
- vue2.0 element-ui中el-select选择器无法显示选中的内容(解决方法)
- vue select选择框数据变化监听方法
- Vue Element 分组+多选+可搜索Select选择器实现示例
- vue 不使用select实现下拉框功能(推荐)
- Vue.js做select下拉列表的实例(ul-li标签仿select标签)
- 浅谈Vue Element中Select下拉框选取值的问题
- vue动态循环出的多个select出现过的变为disabled(实例代码)