vue学习-07-循环列表渲染

v-for指令渲染列表，item是元素别名

<ul>
    <li v-for="item in array">{{item.city}}</li>
</ul>

    const dataObj = {
        array:[
            {
                city:‘beijing‘
            },{
                city: ‘fuzhou‘
            },{
                city: ‘shanghai‘
            }
        ]
    };

可以添加index编号，从0开始

<ul>
    <li v-for="(item,index) in array">{{index}}.{{item.city}}</li>
</ul>

v-for可以支持对象的遍历，支持（value,name,key）

<ul>
    <li v-for="(value,name,key) in object">{{key}}.{{name}}.{{value}}</li>
</ul>

    const dataObj = {
        object : {
            name:‘gui‘,
            key:‘123‘,
            value:‘321‘
        }
    };

支持

vue学习-07-循环列表渲染

原文：https://www.cnblogs.com/keacua/p/15251257.html