vue绑定事件

html 复制代码
<!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">
        <input type="button" value="click" v-on:click="doIt">
        <input type="button" value="简写click" @click="doIt">
        <span @click="changeName" v-text="name"></span>
        <h2>{{ name }}</h2>
    </div>

    <script src="vue.js"></script>
    <script>
        var app = new Vue({
            el: "#app",
            methods: {
                doIt: function () {
                    alert(123);
                },
                changeName: function () {
                    // console.log(this.name);
                    this.name += 'nb';
                }
            },
            data: {
                name: "ajupyter",
            }

        })
    </script>
</body>

</html>
相关推荐
英宋2 分钟前
ckeditor5的研究 (2):对 CKEditor5 进行设计,并封装成一个可用的 vue 组件
前端·javascript
古夕2 分钟前
搞定滚动穿透
前端·javascript
英宋2 分钟前
ckeditor5的研究 (3):初步使用 CKEditor5 的 事件系统 和 API
前端·javascript
lyc2333337 分钟前
鸿蒙多子类型输入法:3步实现输入模式自由切换🔤
前端
Danta7 分钟前
从 0 开始学习 Three.js(2)😁
前端·javascript·three.js
凌辰揽月7 分钟前
Web后端基础(基础知识)
java·开发语言·前端·数据库·学习·算法
Dignity_呱8 分钟前
vue3对组件通信做了哪些升级?
前端·vue.js·面试
植物系青年11 分钟前
基于 Lowcode Engine 的低码平台“编码效率”提升实践
前端·低代码
就是我12 分钟前
开发“业务组件库”,该从哪里入手?
前端·javascript·面试
Mintopia14 分钟前
在数字画布上雕刻曲线:NURBS 的奇幻冒险之旅
前端·javascript·计算机图形学