uniapp实现计数器

Uni-app 是一个跨平台开发框架,可以使用 Vue 组件语法编写一次编译即可发布到多个平台的应用程序,包括iOS、Android、H5、微信小程序等。下面是使用 Vue 组件语法实现计数器的步骤:
1.首先绘制页面

<template>
    <div>
      <p>{{ count }}</p >
      <button @click="increment">+1</button>
      <button @click="decrease">-1</button>
    </div>
</template>

2.在页面组件中定义一个数据变量 count,并初始化为0

export default {
     data() {
       return {
         count: 0
       }
     }
   }

3.点击按钮+1或者-1

export default {
     data() {
       return {
         count: 0
       }
     },
     methods: {
       increment() {
         this.count++
       },
       decrease() {
         this.count--
       }
     }
   }
Logo

为开发者提供学习成长、分享交流、生态实践、资源工具等服务,帮助开发者快速成长。

更多推荐