Vue2.3.3中使用对象展开运算符出错


在vue应用中使用vuex中的...mapGetters时得到如下错误:

<script>
  import VLink from '../components/VLink.vue'
  import store from '../vuex/store';
  import { mapGetters } from 'vuex';

  export default {
    store,
    components: {
      VLink
    },
    computed: {
      // 使用对象展开运算符将 getter 混入 computed 对象中
 ...mapGetters([
        'doneTodos',
        'totalDone',
        // ...
      ]),
      count() {
        return this.$store.state.count;
      },
    },
    methods: {
      increment() {
        this.$store.commit('increment');
      },
      decrement() {
        this.$store.commit('decrement');
      }
    }
  }
</script>

错误:

... unexpected token

解决方法:

这里的 ...是es6的对象扩容运算符,目前bable暂不支持,需要引入新的包来解决

1. npm install babel-plugin-transform-object-rest-spread --save-dev
2. 到根目录修改.babelrc文件
// .babelrc 文件
  "plugins": ["transform-object-rest-spread"] //新增这一行


免责声明!

本站转载的文章为个人学习借鉴使用,本站对版权不负任何法律责任。如果侵犯了您的隐私权益,请联系本站邮箱yoyou2525@163.com删除。



 
粤ICP备18138465号  © 2018-2025 CODEPRJ.COM