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>
相关推荐
LYFlied17 分钟前
WebGPU与浏览器边缘智能:开启去中心化AI新纪元
前端·人工智能·大模型·去中心化·区块链
Setsuna_F_Seiei24 分钟前
2025 年度总结:人生重要阶段的一年
前端·程序员·年终总结
model200535 分钟前
alibaba linux3 系统盘网站迁移数据盘
java·服务器·前端
han_1 小时前
从一道前端面试题,谈 JS 对象存储特点和运算符执行顺序
前端·javascript·面试
aPurpleBerry2 小时前
React 01 目录结构、tsx 语法
前端·react.js
jayaccc2 小时前
微前端架构实战全解析
前端·架构
qingyun9892 小时前
Web Components 实战:创建自定义比例条组件
前端
前端小超超2 小时前
ionic + vue3 + capacitor遇到backButton问题
前端·javascript·vue.js
GIS之路2 小时前
GDAL 空间关系解析
前端
布列瑟农的星空3 小时前
WebAssembly入门(一)——Emscripten
前端·后端