:class v-bind class没有效果无效果-Toy模板网

这篇具有很好参考价值的文章主要介绍了:class v-bind class没有效果无效果。希望对大家有所帮助。如果存在错误或未考虑完全的地方，请大家不吝赐教，您也可以点击"举报违法"按钮提交疑问。

项目场景：

写完后端之后，在写前端的小程序时候遇到的一个v:bind class问题

问题描述

在这边使用了：clas 但是迟迟没有反应

	<view class="value" v-for="(value, key) in item.values   " :key="key"
									:class="{'default': value.is_default}" @tap="changePropertyDefault(index, key)">
									{{ value.value }}
								</view>

原因分析：

因为是先写的后台，所以很多api都已经写好了，回过头来使用一个uniapp小程序的模板的时候，发现模板要的json数据和自己原来写的返回值不一致，于是就打算直接在前端进行修改了。
v-bind在css中失效,javascript,前端,小程序
可以看到，前端模板要的json数据是这样的，但是我原来写的是api返回值是下面这样

那么现在面临的难度就是在首先需要将value中的json格式转换成数组，并且还要增加is_default这个值，这个值很重要，:class不生效就是因为这个原因，搞了我好久。

解决方案：

v-bind在css中失效,javascript,前端,小程序
这一段为核心代码，首先在给good初始化的时候，咱们就需要进行这些转换。注意this.obj需要在vue data下面定义好然后，const obj这个也是一定要用const的不能使用var 和let之类的。因为使用const后面的数据就不会改变了。