工作上会用到的代码片段(vue.json)

vue template

"vueTemplate": {
      "prefix": "jstm",
      "body": [
          "<template>",
          "  <div>\n",
          "  </div>",
          "</template>\n",
          "<script>",
          "export default {",
          "  name:'',",
          "  props: {\n",
          "  },",
          "  data() {",
          "     return {\n",
          "     };",
          "  },",
          "  computed: {\n",
          "  },",
          "  created() {\n",
          "  },",
          "  mounted() {\n",
          "  },",
          "  watch: {\n",
          "  },",
          "  methods: {\n",
          "  },",
          "  components: {\n",
          "  },",
          "};",
          "</script>\n",
          "<style scoped lang=\"${1:scss}\">\n",
          "</style>\n",
      ],
      "description": "Create vue template"
  },

ts template

"tsTemplate": {
    "prefix": "tstm",
    "body": [
        "<template>",
        "  <div>\n",
        "  </div>",
        "</template>\n",
        "<script lang=\"${1:ts}\">",
        "import Vue from 'vue';",
        "import { Component } from 'vue-property-decorator';",
        "import { getModule } from 'vuex-module-decorators';",
        "import store from '../../../libs/store';",
        "import TestStore from '../../../libs/store/test/index';",
        "const testStore = getModule(TestStore, store);",
        "@Component({",
        "  props: {",
        "    index: {",
        "      type: Number,",
        "      required: true,",
        "    },",
        "  },",
        "  components: {",
        "  },",
        "})",
        "export default class MyTest extends Vue {",
        "  // 初始化数据",
        "  private MSG: number = 123;",
        "  private helloMsg: string = 'hello' + this.MSG;",
        "  // 计算属性",
        "  get computedMsg() {",
        "    return '667';",
        "  }",
        "  // 处理函数方法",
        "  protected getImportInfo() {",
        "    alert(123456);",
        "  }",
        "}",
        "</script>\n",
        "<style scoped lang=\"${2:scss}\">\n",
        "</style>\n",
    ],
    "description": "Create vue template of TS"
  },

ts store/index.ts

"tsStore": {
    "prefix": "tsst",
    "body": [
       "import Vue from 'vue';",
       "import Vuex from 'vuex';",
       "import TestStore from './Test/index';",
       "import Test from './test/index';",
       "Vue.use(Vuex);",
       "export default new Vuex.Store({",
       "  modules: {",
       "    Test,",
       "  },"
       "});",
       "",
    ],
    "description": "Create vue Store of TS"
  },

ts store/test/index.ts

"tsModStore": {
    "prefix": "tsmodst",
    "body": [
       "import { Module, VuexModule, Mutation, Action } from 'vuex-module-decorators';",
       "@Module({ name: 'Test', namespaced: true, stateFactory: true })",
       "export default class Test extends VuexModule {",
       "  public count: number = 12;",
       "  get getCount() {",
       "    return this.count;",
       "  }",
       "  @Mutation",
       "  public changeShowStatus(num: number) {"
       "    this.count= num;",
       "  }",
    ],
    "description": "Create vue Mod Store of TS"
  },
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值