Vue事件机制和事件修饰符

1. 事件绑定：

1. 使用v-on事件名 或 @事件名绑定事件
2. 事件的回调需要配置在methods对象上，最终会出现在vm上；
3. methods中配置方法的函数，不要使用箭头函数，否则this就不是vm了
4. methods中配置的函数，都是被vue所管理的函数，this的指向是vm 或组件实例化对象
5. @click=“事件名” 和 @click=“事件名（$event）” 效果一致，但后者可以传参

错误写法：一定不要写成箭头函数！

<script>
		new Vue({
     
			el:"#app",
			data:{
     
				
			},
			methods:{
     
        showInfo:()=>{
     
          console.log(this); //此处的this是window
        }
      }
		})
	script>

简单案例及事件传递函数：

<div id="app">
    <h2>欢迎来到{
  {name}}学习h2>


    <button @click="showInfo1">点我提示信息1(不传参)button>
    <button @click="showInfo2($event,66)">点我提示信息(传参)button>
div>
<script>
    const vm= new Vue({
     
        el:"#app",
        data:{
     
            name:"清华大学"
        },
        methods:{
     
            showInfo1(event){
     
                console.log(event.target.innerText);
                console.log(