vue的getters属性

vue的getters属性相当于计算属性,可以对数据进行二次处理

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title></title>
    <script src="vue.js"></script>
    <script src="vuex.js"></script>
</head>
<body>
    <div id="box">
       <button @click="add">{{count}}</button>
    </div>
</body>
    <script>
       var box=new Vue({
          el:"#box",
          data:{
              
          },
          computed:Vuex.mapGetters({
              count:"$count"
          }),
          methods:{
              add:function(){
                 this.$store.commit("add");
              }
          },
          store:new Vuex.Store({
              state:{
                 count:0
              },
              mutations:{
                  add:function(state){
                     state.count++
                  }
              },
              getters:{
                  $count:function(state){
                     return "$"+state.count
                  }

              }//相当于计算属性,可以对数据进行二次的处理
          })
       })

    </script>
</html>
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 关于Mongodb的全面总结 MongoDB的内部构造《MongoDB The Definitive Guide》...
    中v中阅读 32,041评论 2 89
  • 我是1990年即将过农历春节时出生的,在90年的尾巴上,因此为了显小,为了年龄优势的虚荣和得到额外的惠顾我对外宣称...
    遇见明月阅读 5,651评论 106 138
  • 机械硬盘和固态硬盘 机械硬盘:传统硬盘,优势是价格 固态硬盘:新一代硬盘,优势是读取和写入速度快,缺点是价格较高 ...
    WJustHM阅读 386评论 0 0
  • 所有不放弃的瞬间,加起来就是生活
    张小七的七阅读 174评论 0 0
  • 38周孕妈妈和胎宝宝的变化 此时,胎宝宝的肌肉已经比之前发达了很多,而且动作越来越协调了。为了在分娩时头部能够顺利...
    ded5c8b65735阅读 635评论 0 0