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>
相关推荐
阿成学长_Cain21 分钟前
Linux dirs命令详解|Bash目录堆栈管理快速切换目录实战教程
linux·运维·前端·数据库
多加点辣也没关系32 分钟前
JavaScript|第4章:类型转换
开发语言·javascript
yqcoder1 小时前
httpOnly 是什么,又有什么用?
开发语言·前端·javascript
IT_陈寒1 小时前
Java的Stream.parallel()把我CPU跑爆了,这种优化要谨慎
前端·人工智能·后端
小皮虾1 小时前
小程序首页性能优化实战:从 4 秒到 1.8 秒
前端·微信小程序
烬羽1 小时前
还在手动拼路径、写回调地狱?一文吃透 Node.js 的 path 和 fs
javascript·程序员·node.js
山河木马1 小时前
GPU自动处理专题1-裁剪到底在裁什么(裁剪)
前端·webgl·计算机图形学
奔跑的蜗牛ing1 小时前
CentOS Nginx 安装与静态文件服务器配置指南
前端·面试·架构
mONESY1 小时前
LangChain JS 高性能并行执行解析、工具调用底层封装
javascript