“Vue 计数器”的版本间的差异

来自姬鸿昌的知识库
跳到导航 跳到搜索
第16行: 第16行:
 
   }
 
   }
 
})
 
})
</syntaxhighlight><u>data</u> 中定义数据:比如 <u>num</u>
+
</syntaxhighlight>
  
methods 中添加两个方法:比如 <u>add</u>(递增),<u>sub</u>(递减)
+
# <u>data</u> 中定义数据:比如 <u>num</u>
 +
# methods 中添加两个方法:比如 <u>add</u>(递增),<u>sub</u>(递减)
 +
# 使用 v-text 将 num 设置给 span 标签

2023年6月8日 (四) 13:34的版本

https://www.bilibili.com/video/BV12J411m7MG/?p=10

<div class="input-num">
  <button @click>-</button>
  <span>{{}}</span>
  <button @click>+</button>
</div>

var app = new Vue({
  el:"#app",
  data:{
    num:1
  },
  methods:{
    add:function(){},
    sub:function(){}
  }
})
  1. data 中定义数据:比如 num
  2. methods 中添加两个方法:比如 add(递增),sub(递减)
  3. 使用 v-text 将 num 设置给 span 标签