vue如何反转数组

vue如何反转数组

这篇文章主要讲解了“vue如何反转数组”,文中的讲解内容简单清晰,易于学习与理解,下面请大家跟着小编的思路慢慢深入,一起来研究和学习“vue如何反转数组”吧!

vue中可以利用“v-for”指令和计算属性来反转数组,语法“<div v-for="item in reverseDIV">”和“computed:{reverseDIV(){return this.items.reverse()}}”。

本教程操作环境:windows7系统、vue2.9.6版,DELL G3电脑。

vue反转数组的方法

方法一:

<template><div><divv-for="iteminArray.prototype.reverse.call(items)"><li>{{item}}</li></div></div></template><script>exportdefault{name:"List",data(){return{items:[1,2,3,4]}},}</script>

方法二(计算属性):

<template><div><divv-for="iteminreverseDIV"><li>{{item}}</li></div></div></template><script>exportdefault{name:"List",data(){return{items:[1,2,3,4]}},computed:{reverseDIV(){returnthis.items.reverse()}}}</script>

说明:计算属性

类型:{ [key: string]: Function | { get: Function, set: Function } }

详细:

计算属性将被混入到 Vue 实例中。所有 getter 和 setter 的 this 上下文自动地绑定为 Vue 实例。

注意如果你为一个计算属性使用了箭头函数,则 this 不会指向这个组件的实例,不过你仍然可以将其实例作为函数的第一个参数来访问。

computed:{aDouble:vm=>vm.a*2}

计算属性的结果会被缓存,除非依赖的响应式属性变化才会重新计算。注意,如果某个依赖 (比如非响应式属性) 在该实例范畴之外,则计算属性是不会被更新的。

主要是不污染源数据的情况下我们进行的一系列操作

感谢各位的阅读,以上就是“vue如何反转数组”的内容了,经过本文的学习后,相信大家对vue如何反转数组这一问题有了更深刻的体会,具体使用情况还需要大家实践验证。这里是亿速云,小编将为大家推送更多相关知识点的文章,欢迎关注!

发布于 2022-01-10 23:47:45
收藏
分享
海报
0 条评论
40
上一篇:html中script怎么用 下一篇:python遍历迭代器自动链式处理数据的代码怎么写
目录

    0 条评论

    本站已关闭游客评论,请登录或者注册后再评论吧~

    忘记密码?

    图形验证码