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>
相关推荐
bitbitDown1 分钟前
重构缓存时踩的坑:注释了三行没用的代码却导致白屏
前端·javascript·vue.js
xiaopengbc5 分钟前
火狐(Mozilla Firefox)浏览器离线安装包下载
前端·javascript·firefox
用户0165238444125 分钟前
Webpack5 入门与实战,前端开发必备技能无密
前端
小高00725 分钟前
🔥🔥🔥前端性能优化实战手册:从网络到运行时,一套可复制落地的清单
前端·javascript·面试
古夕28 分钟前
my-first-ai-web_问题记录01:Next.js的App Router架构下的布局(Layout)使用
前端·javascript·react.js
Solon阿杰31 分钟前
solon-flow基于bpmnJs的流程设计器
javascript·bpmn-js
Solon阿杰32 分钟前
前端(react/vue)实现全景图片(360°)查看器
javascript·vue.js
杨超越luckly34 分钟前
HTML应用指南:利用POST请求获取上海黄金交易所金价数据
前端·信息可视化·金融·html·黄金价格
郝学胜-神的一滴35 分钟前
Three.js 材质系统深度解析
javascript·3d·游戏引擎·webgl·材质
Jerry39 分钟前
Compose 中的基本布局
前端