<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<script src="../js/vue.js"></script>
</head>
<body>
<div id="app">
<li v-for="(item,index) in items" :key="index">{{item}}---->{{index}}</li>
</div>
<script>
var vm = new Vue({
el: "#app",
data: {
items: ['zhangsan', 'lisi', 'wangwu']
}
});
// 为数组添加元素
vm.items.push('yello');
// 对数组进行排序
vm.items.sort();
// 对数组进行逆向排序
vm.items.reverse();
// splice(index,len,[item])
// index:数组开始下标
// len: 替换/删除的长度
// item:替换的值,删除操作的话item为空。
vm.items.splice(1,0,"gou");
</script>
</body>
</html>
2、替换元素示例
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<script src="../js/vue.js"></script>
</head>
<body>
<div id="app">
<li v-for="(item,index) in items" :key="index">{{item}}---->{{index}}</li>
</div>
<script>
var vm = new Vue({
el: "#app",
data: {
items: ['zhangsan', 'lisi', 'wangwu']
}
});
// vm.$set(vm.items, indexOfItem, newValue) 替换元素
vm.$set(vm.items,2,'goudan')
</script>
</body>
</html>