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>
相关推荐
恋猫de小郭6 分钟前
Dart 3.13 的到底改了什么?为什么很重要?有什么坑?
android·前端·flutter
这是个栗子11 分钟前
前端开发中的常用工具函数(十):JavaScript 数组遍历
javascript·map·遍历·filter·foreach·for·for...of
FYKJ_201019 分钟前
django学习成绩预警系统10905
java·javascript·spring boot·python·spark·django·php
云浪20 分钟前
给大模型装上"手":三分钟看懂 AI Agent 的 Tool 工具调用
javascript·人工智能·node.js
风月说与山鬼21 分钟前
六、React事件
前端·javascript·react.js
岁岁种桃花儿22 分钟前
Vue核心语法第十四篇:列表过滤
前端·javascript·vue.js
晓得迷路了23 分钟前
栗子前端技术周刊第 143 期 - npm 攻击事件、Bun 1.4...
前端·javascript
YHHLAI23 分钟前
实战 Vibe Coding:用 AI 从零搭一个 React 待办清单
前端·人工智能·react.js
常宇佳30 分钟前
vue3 实战系列之踩过的一些坑
javascript·vue.js·elementui
CSharp精选营1 小时前
用 .NET 8 + uni-app 做一套多租户畜牧 SaaS:我们在秦巴牧云踩过的 6 个坑
uni-app·efcore·.net8·多租户·saas踩坑