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-循环列表渲染

上一篇:配置nginx域名和端口转发反向代理


下一篇:MarkDown基本语法