美文网首页
vue的getters属性

vue的getters属性

作者: 嗯哼_3395 | 来源:发表于2018-07-07 15:21 被阅读0次

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>

相关文章

网友评论

      本文标题:vue的getters属性

      本文链接:https://www.haomeiwen.com/subject/pdgwuftx.html