vue中v-on绑定事件

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>基本代码</title>
    <script src="vue.js"></script>
</head>
<body>
    <!--容器-->
    <div id="app">
        <!--v-on绑定事件,v-on等价于@-->
       <input type="button" v-on:mouseover="alert" ></input>
       <input type="button" @mouseover="alert" ></input>
    </div>
<script>
    // 创建一个vue实例
    var vm=new Vue({
        el:'#app',  // 绑定id为appid容器
        data:{
            mytitle:'这个是标题'
        },
        methods:{
            alert:function () {
                alert("v-on弹出的玩意")
            },
            alert(){
                alert("和上面的写法一样")
            }
            
        }
    })
</script>
</body>
</html>

效果:

猜你喜欢

转载自blog.csdn.net/qq_31293575/article/details/81117146