鱼少学习多摸

day95-vue版本的求和问题

求和案例-vue版本

简单的点击操作求和加减操作

复制代码
 <template>
   <div>
     <h1>当前求和为{{sum}}</h1>
     <select v-model="n">
       <option :value="1">1</option>
       <option :value="2">2</option>
       <option :value="3">3</option>
     </select>
     <button @click="increment">+</button>
     <button @click="decrement">-</button>
     <button @click="incrementOdd">当前求和为奇数再加</button>
     <button @click="incrementWait">等一等再加</button>
   </div>
 </template><script>
 export default {
   name: "CountCom",
   data() {
     return {
       n: 1,//用户选择的数字
       sum: 0//当前的sun值
     }
   },
   methods: {
     increment() {
       this.sum +=this.n
     },
     decrement(){
       this.sum -= this.n
     },
     incrementOdd(){
       if (this.sum%2){
         this.sum +=this.n
       }
     },
     incrementWait(){
       setTimeout(()=>{
         this.sum +=this.n
       },500)
     }
   }
 }
 </script>
复制代码

 

 
posted @   北海之上  阅读(32)  评论(0编辑  收藏  举报
相关博文:
阅读排行:
· 被坑几百块钱后,我竟然真的恢复了删除的微信聊天记录!
· 没有Manus邀请码?试试免邀请码的MGX或者开源的OpenManus吧
· 【自荐】一款简洁、开源的在线白板工具 Drawnix
· 园子的第一款AI主题卫衣上架——"HELLO! HOW CAN I ASSIST YOU TODAY
· 无需6万激活码!GitHub神秘组织3小时极速复刻Manus,手把手教你使用OpenManus搭建本
/* 粒子吸附*/
点击右上角即可分享
微信分享提示