uni-app 之 v-on:click点击事件

uni-app 之 v-on:click点击事件

image.png

复制代码
<template>
    <!-- vue2的<template>里必须要有一个盒子,不能有两个,这里的盒子就是 view-->
    <view>
        --- v-on:click点击事件 ---
        <view v-on:click="onclick">{{title}}</view>
        --- 点击事件简写 @click ---
        <view @click="onclicknum">数字:{{num}}</view>
    </view>
</template>

<script>
    export default {
        data() {
            return {
                title: "事件1",
                num: 1
            }
        },
        methods: {
            // vue3里可以直接省略this. vue2则不可以
            onclick: function() {
                this.title = "事件点击后变化"
            },
            
            // 简写,直接省略: function
            // onclicknum() {
            //  this.num++
            // },
            onclicknum: function() {
                this.num++
            }
            
        }
    }
</script>

<style lang="scss">
</style>
相关推荐
kyriewen19 小时前
浏览器缓存最强攻略:强缓存、协商缓存、CDN、更新策略,一篇搞定
前端·面试·浏览器
持敬chijing20 小时前
Web渗透之SQL注入-联合查询注入-注入点数据类型判断
前端·sql·安全·web安全·网络安全·安全威胁分析
卷帘依旧20 小时前
Web3前端一面
前端
古韵20 小时前
告别手写分页逻辑:usePagination 从 50 行到 3 行
java·前端
小村儿20 小时前
连载12- Cluade code 的MCP 到底还用不用
前端·后端·ai编程
IT_陈寒20 小时前
Vite静态资源引用差点把我逼疯,原来要这样处理
前端·人工智能·后端
子兮曰21 小时前
WSL 配 GPU 用 Docker 的折腾指南(2026 年版)
linux·前端·后端
LIUAWEIO21 小时前
vue里面下载配置使用zepto vue中怎样使用zepto
javascript·vue.js·es6·zepto
lantian21 小时前
TypeScript 三斜线指令完全指南:从入门到理解为什么不再需要它
前端·javascript·vue.js
用户9385156350721 小时前
从"用栈实现队列"说起:深入理解 JavaScript 原型式面向对象
javascript