es6 class写法 报错为什么？

Question

第一种写法为什么会报错

写法一 报错

export class Swip1{
    methods:{
        swipeHandler: function(params) { <- 这个地方提示有错
          if(-1 < temp && temp< this.magjorCategoryList.majorCategory.length){
            this.setSelect = temp;
            console.log(this.magjorCategoryList.majorCategory[temp])
            this.changeSelect(temp,this.magjorCategoryList.majorCategory[temp])
            this.$bus.$emit("activeTabToCenter", document.getElementById('label' + temp));
          }
        }
    }
}

写法二 没问题

export let Swip = {
  methods: {
    swipeHandler: function (temp) {
      if(-1 < temp && temp< this.magjorCategoryList.majorCategory.length){
        this.setSelect = temp;
        console.log(this.magjorCategoryList.majorCategory[temp])
        this.changeSelect(temp,this.magjorCategoryList.majorCategory[temp])
        this.$bus.$emit("activeTabToCenter", document.getElementById('label' + temp));
      }
    }
  }
}

Answer 1

建议看一下 阮一峰老师的 Class 的基本语法 - ECMAScript 6入门。

类的属性和方法并不是你这样写的。

---

如果你有想要用混入可以这样写

// myMixin.js
export const myMixin = {
  data() {
    return {
    }
  },
  computed: {
  },
  created() {
  },
  methods:{
  }
}

然后再在你需要引入混入的组件里面这样引入就行了

<template>
    ...
</template>
<script>
import { myMixin } from "@/mixins/myMixin";
export default {
  mixins: [myMixin],
  ...
}
</script>

同时 Vue 的文档也可以好好看看的，特别是在你需要用到的时候。
关于混入的部分在这里 👉 混入 — Vue.js

Answer 2

类里面不能再包含对象吧，下面这样就可以

class Swip1{
    swipeHandler (params) {
      if(-1 < temp && temp< this.magjorCategoryList.majorCategory.length){
        this.setSelect = temp;
        console.log(this.magjorCategoryList.majorCategory[temp])
        this.changeSelect(temp,this.magjorCategoryList.majorCategory[temp])
        this.$bus.$emit("activeTabToCenter", document.getElementById('label' + temp));
      }
    }
}

Answer 3

改成等于号。

---

class 语法是：

class Foo {
  prop = bar
}

不是：

class Foo {
  prop: bar
}