目录
1.v-on：
2.页面效果
3.结构
v-on：
(1)作用：注册事件=添加监听+提供处理逻辑
(2)语法：
（=后：提供处理逻辑）
①v-on:事件名="内联语句"
②v-on:事件名="methods中的函数名
一、@事件名="内联语句" ---适用于简单逻辑代码
1.代码
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<div id="app">
<!-- click:点击 -->
<button @click="count--">-</button>
<span>{{count}}</span>
<button @click="count++">+</button>
<!-- 鼠标划在＋或 —上面，即可实现＋或— -->
<!-- <button @mouseenter="count--">-</button>
<span>{{count}}</span>
<button @mouseenter="count++">+</button> -->
</div>
<script src="https://cdn.jsdelivr.net/npm/vue@2.7.16/dist/vue.js"></script>
<script>
const app=new Vue({
el:"#app",
data:{
count:100
}
})
</script>
</body>
</html>2.页面效果
3.结构
二、@事件名="methods中的函数名"
