欢迎来到代码驿站!

vue

当前位置:首页 > 网页前端 > vue

vuex中使用对象展开运算符的示例

时间:2021-01-09 11:16:21|栏目:vue|点击:

使用场景

当需要进行vuex进行数据状态管理的时候,会使用到mapGetters,mapState,还有自身的计算属性的时候,这个时候就会用到这个了!

1.首先需要安装

npm install babel-plugin-transform-object-rest-spread -D 

2.需要在.babelrc文件中新增以下

{

 "presets": [

  ["env", { "modules": false }]

 ],

 "plugins": ["transform-object-rest-spread"] //增加这一行

} 

3.在vue组件中使用

<script>

  import {mapState,mapGetters} from 'vuex'

  export default {

    methods:{

      increment(){

        this.$store.commit('increment');

      }

    },

    computed:{

      ...mapGetters([

        'count'

      ]),

      ...mapState({

        counts(){

          return this.$store.state.count;

        }

      })

    }

  }

</script> 

上一篇:基于Vue2实现的仿手机QQ单页面应用功能(接入聊天机器人 )

栏    目:vue

下一篇:Vue-CLI与Vuex使用方法实例分析

本文标题:vuex中使用对象展开运算符的示例

本文地址:http://www.codeinn.net/misctech/42836.html

推荐教程

广告投放 | 联系我们 | 版权申明

重要申明:本站所有的文章、图片、评论等,均由网友发表或上传并维护或收集自网络,属个人行为,与本站立场无关。

如果侵犯了您的权利,请与我们联系,我们将在24小时内进行处理、任何非本站因素导致的法律后果,本站均不负任何责任。

联系QQ:914707363 | 邮箱:codeinn#126.com(#换成@)

Copyright © 2020 代码驿站 版权所有