vue 示例 todolist

万年不变的todolist 

<!DOCTYPE html>
<html>
<head>
	<title>todolist</title>
	<meta charset="utf-8">
	<script src="./vue.js"></script>
</head>
<body>
	<div id="root">
		<div>
			<input v-model="inputValue" />
			<button @click="handleclick">提交</button>
		</div>
		<ul>
			<li v-for="(item,index) of list" :key="index">
				{{item}}
			</li>
		</ul>
	</div>

	<script >
		new Vue({
			el: "#root",
			data: {
				inputValue: "",
				list: []
			},
			methods: {
				handleclick: function(){
					this.list.push(this.inputValue);
					this.inputValue = '';
				}
			}
		})
	</script>
</body>
</html>

猜你喜欢

转载自blog.csdn.net/purple_lumpy/article/details/81158595