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

更新时间：2019年08月29日 08:38:21 作者：小小咸鱼YwY

这篇文章主要介绍了Vue中的循环及修改差值表达式的方法，本文通过实例代码给大家介绍的非常详细，具有一定的参考借鉴价值,需要的朋友可以参考下

一.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>

总结

以上所述是小编给大家介绍的Vue中的循环及修改差值表达式的方法,希望对大家有所帮助，如果大家有任何疑问请给我留言，小编会及时回复大家的。在此也非常感谢大家对脚本之家网站的支持！
如果你觉得本文对你有帮助，欢迎转载，烦请注明出处，谢谢！

您可能感兴趣的文章:

vue2.0 可折叠列表 v-for循环展示的实例
今天小编大家分享一篇vue2.0 可折叠列表 v-for循环展示的实例，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧
2018-09-09
vue3 :deep()的使用教程
对应前端小白来说,一看到:deep()这些模式的用法就不理解是啥意思,下面简单介绍一下:deep()是什么以及如何使用,感兴趣的朋友跟随小编一起看看吧
2023-10-10
利用vue-i18n实现多语言切换效果的方法
这篇文章主要给大家介绍了关于利用vue-i18n实现多语言切换效果的方法，文中通过示例代码介绍的非常详细，对大家学习或者使用vue-i18n具有一定的参考学习价值，需要的朋友们下面来一起学习学习吧
2019-06-06
Vue 动态路由的实现及 Springsecurity 按钮级别的权限控制
这篇文章主要介绍了Vue 动态路由的实现以及 Springsecurity 按钮级别的权限控制的相关知识，本文通过实例代码给大家介绍的非常详细，具有一定的参考借鉴价值,需要的朋友可以参考下
2019-09-09
Vue3中关于ref和reactive的区别分析
这篇文章主要介绍了vue3关于ref和reactive的区别分析，文中通过示例代码介绍的非常详细，具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习吧
2023-06-06
通过fastclick源码分析彻底解决tap“点透”
这篇文章主要介绍了通过fastclick源码分析彻底解决tap“点透”问题的知识内容，有兴趣的朋友学习一下吧。
2017-12-12
Vue Extends 扩展选项用法完整实例
这篇文章主要介绍了Vue Extends 扩展选项用法,结合完整实例形式分析了Vue Extends 扩展选项相关使用技巧与操作注意事项,需要的朋友可以参考下
2019-09-09
Vue一个案例引发的递归组件的使用详解
这篇文章主要介绍了Vue一个案例引发的递归组件的使用，本文主要给大家展示如何在项目中使用递归组件，本文给大家介绍的非常详细，具有一定的参考借鉴价值,需要的朋友可以参考下
2018-11-11
vue封装Animate.css动画库的使用方式
这篇文章主要介绍了vue封装Animate.css动画库的使用方式,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教
2024-04-04
vue循环数组改变点击文字的颜色
这篇文章主要为大家详细介绍了vue循环数组改变点击文字的颜色，非常实用的切换效果，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
2019-10-10

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

相关文章

最新评论

大家感兴趣的内容

最近更新的内容

常用在线小工具