欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  IT编程

Vue中的循环以及修改差值表达式

程序员文章站 2022-07-09 20:26:25
0828自我总结 一.Vue中的循环 常见的4总情况 二.Vue中的分隔符(修改差值表达式) 举个例子 html [[ msg }} new Vue({ el: ' app', data: { msg: 'message' }, // 修改插值表达式符号 delimiters: ['[[', '}} ......

一.vue中的循环

v-for

常见的4总情况

#第一种
<div v-for="item in items"></div>

#第二种
<div v-for="(item, index) in items"></div>

#第三种
<div v-for="(val, key) in object"></div>

#第四种
<div v-for="(val, name, index) in object"></div>
正对于对象为字典,如果是普通的列表数组类型的index为空

二.vue中的分隔符(修改差值表达式)

delimiters

举个例子

<div id="app">
    [[ msg }}
</div>
<script src="vue.js"></script>
<script>
    new vue({
        el: '#app',
        data: {
            msg: 'message'
        },
        // 修改插值表达式符号
        delimiters: ['[[', '}}'],   两边符号用'符号' 差值的内容`, `来表示
    })
</script>