Vue.js学习系列(六)---条件与循环

来源:互联网 发布:淘宝有没有死店一说 编辑:程序博客网 时间:2024/06/05 06:39

在vuejs中同样可以进行条件判断和循环。

1.条件判断

vuejs通过“v-if”指令执行判断

v-if表示的是值为true则显示该标签,为false则不显示;


这段代码表示,如果abc这个对象存在的话,就显示这一行数据,它的值为abc.a。如果不存在的话,就不显示。显然在该代码中abc对象是存在的,且abc.a的值为1.所以最后在页面上显示的是1。

2.循环

vuejs中的循环时通过v-for指令来执行的。它表示的是列表渲染。


这里的items可以是一个对象那个也可以是一个数组。v-for="i in items"就相当于

for(var  i in  items).{{i}}就相当于是items[i].这里的li会被复制多个,然后依次被items[i]渲染,直到渲染完毕;最终在页面显示的是值为1 2 3的列表。

 

 

0 0