绑定事件(v-on)

<!DOCTYPE html>
<html lang="en" xmlns:v-on="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="UTF-8">
    <title>绑定事件学习 v-on</title>
</head>
<body>

    <div id="app">
            <button v-on:click="sayHi">点击一下</button>
    </div>

    <!--引入vue的cdn-->
    <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/vue.min.js"></script>
    <script>
        var vm = new Vue({
            el: "#app",
            data: {
                message: "hello,springVue!!!"
            },
            methods : {
                sayHi : function (event) {
                    // this 指代的是new Vue这个对象
                    alert(this.message)
                }
            }
        });
    </script>

</body>
</html>

结果如下

在这里插入图片描述

猜你喜欢

转载自blog.csdn.net/fgets__/article/details/121452913