<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
<script src="../js/Vue2.5.16.js"></script>
</head>
<body>
<div id="millia">
<input v-model="int" type="text">
<button @click="hand">提交</button>
<ul>
<li v-for="item in lists">{{item}}</li>
</ul>
</div>
<script>
var vm = new Vue ({
el: "#millia",
data: {
lists: [],
int:"",
},
methods: {
hand: function(){
this.lists.push(this.int);
this.int = "";
}
}
});
</script>
</body>
</html>涉及知识点：
JavaScript push() 方法
定义和用法
push() 方法可向数组的末尾添加一个或多个元素，并返回新的长度。
语法
arrayObject.push(newelement1,newelement2,....,newelementX)
| 参数 | 描述 |
|---|---|
| newelement1 | 必需。要添加到数组的第一个元素。 |
| newelement2 | 可选。要添加到数组的第二个元素。 |
| newelementX | 可选。可添加多个元素。 |
返回值
把指定的值添加到数组后的新长度。
说明
push() 方法可把它的参数顺序添加到 arrayObject 的尾部。它直接修改 arrayObject，而不是创建一个新的数组。push() 方法和 pop() 方法使用数组提供的先进后出栈的功能。
关于this的使用
this.数据名 指当前实例中data方法中的数据对应名字，注意：不需要像jquery那样前面加$例如：
this.lists.push(this.int); this.int = "";