vue数组变异方法非变异方法

最新推荐文章于 2024-04-16 00:24:12 发布

昵称2-20个字符

最新推荐文章于 2024-04-16 00:24:12 发布

阅读量1k

点赞数 2

分类专栏： vue demo 文章标签： vue 数组变异方法非变异方法

本文链接：https://blog.csdn.net/weixin_39517183/article/details/106797380

版权

Vue为了增加列表渲染的功能，增加了一组观察数组的方法，而且可以显示一个数组的过滤或排序的副本。

变异方法

Vue 包含一组观察数组的变异方法，它们将会触发视图更新，包含以下方法：
变异方法:改变原数组,使视图更新

push() 接收任意数量的参数，把它们逐个添加到数组末尾，并返回修改后数组的长度
pop() 从数组末尾移除最后一项，减少数组的length值，然后返回移除的项
shift() 移除数组中的第一个项并返回该项，同时数组的长度减1
unshift() 在数组前端添加任意个项并返回新数组长度
splice() 删除原数组的一部分成员，并可以在被删除的位置添加入新的数组成员
sort() 调用每个数组项的toString()方法，然后比较得到的字符串排序，返回经过排序之后的数组
reverse() 用于反转数组的顺序，返回经过排序之后的数组

demo:


<!DOCTYPE html>
<html lang="en">
	<head>
		<meta charset="UTF-8">
		<title>Document</title>
	</head>
	<body>
		<div id="app">
			<div>
				<button @click='push'>push</button>
				<button @click='pop'>pop</button>
				<button @click='shift'>shift</button>
				<button @click='unshift'>unshift</button>
				<button @click='splice'>splice</button>
				<button @click='sort'>sort</button>
				<button @click='reverse'>reverse</button>
			<

最低0.47元/天解锁文章

昵称2-20个字符

关注

2
点赞
踩
4

收藏

觉得还不错? 一键收藏
0
评论
vue数组变异方法非变异方法

Vue为了增加列表渲染的功能，增加了一组观察数组的方法，而且可以显示一个数组的过滤或排序的副本。变异方法Vue 包含一组观察数组的变异方法，它们将会触发视图更新，包含以下方法：变异方法:改变原数组,使视图更新push() 接收任意数量的参数，把它们逐个添加到数组末尾，并返回修改后数组的长度pop() 从数组末尾移除最后一项，减少数组的length值，然后返回移除的项shift() 移除数组中的第一个项并返回该项，同时数组的长度减1unshift() 在数组前端添加任意个项并返回新数组长度.
复制链接

扫一扫