<!doctype html>
<html>
<head>
<meta charset="utf-8">
<script src="vue.js"></script>
</head>
<body>
<h1>(9)v-on事件</h1>
<!-- View -->
<div id="app">
<div>{{age}}</div>
<div>
<button v-on:click="age++">单击事件</button>
<button @click="age++">单击事件</button>
</div>
<div>
<button v-on:dblclick="age--">双击事件</button>
<button @dblclick="age--">双击事件</button>
</div>
<div>
<button v-on:mousemove="age++">鼠标事件</button>
<button @mousemove="age++">鼠标事件</button>
</div>
<div>
<input type="text" v-on:keyup="age--">键盘事件
<input type="text" @keyup="age--">键盘事件
</div>
</div>
<script>
// Model
var data = {age:20};
// ViewModel
var vue = new Vue({
el:'#app',
data:data
});
</script>
</body>
</html>
Vue(8)v-for迭代JSON数组
于 2021-06-17 10:12:11 首次发布