vue在使用v-for的时候,经常会有数据显示失效的时候,比如:
<li v-for="new_art in data_list"><span><i class="el-arrow-up fa fa-paper-plane-o"></i>最近:<font class="blue-text">{{ new_art.author.name }}</font> {{ new_art.created_at }}</span><a href="/article/content/{{ new_art.uid }}/?num=1" title="{{ new_art.title }}">更新了<b class="lable">文章</b></a></li>
这段代码,我在使用vue 的时候,无论如何使用v-for,都无法出来数据
但是大部分情况还是能正常使用的
接下来列几点需要经常会出错的点:
1.vue在使用的时候,命名要规范
Vue.use(VueResource);
function api_request(id,URLobj) {
var vue = new Vue({
el:id,
data:{
data_list:[]
},
created:function () {
this.$http.get(URLobj).then(
function (data) {
this.data_list = data.data.data;
},
function (error) {
console.log(error)
}
)
}
})
}
在我的这段vue里,id是绑定数据的id,URLobj是路由地址,
当我调用这段vue的时候
api_request('#3tag','/APItag/');
当我命名成这样的时候,数据无法出来,我当时认为id是唯一的,数据显示与否应该和这个id无关,但是当我鬼使神差的改了id:
api_request('#tag_cloud','/APItag/');
数据就正常显示了
2,v-bind使用格式:
v-bind:href="'/article/content/'+art.uid+'/?num=0'"
格式,v-bind:属性名=" ‘字符串’+变量+‘字符串’ "
3.标签嵌套太复杂可能会影响数据显示
当我的标签嵌套过于复杂时,有时候v-for循环就可能失效
4.还有很多其他的,比如v-if,v-on等,都比较简单,基本使用可以满足