vscode 自定义全局代码片段 （uni-app，vue）

输入名字后直接赋值对应的代码。保存即可。
1.vue

{
    "Print to console": {
    //这里自定义快捷名称
        "prefix": "vue-pc",
        "body": [
            "<!-- $1 -->",
            "<template>",
            "<div class='$2'>$5</div>",
            "</template>",
            "",
            "<script>",
            "",
            "export default {",
            "// import引入的组件需要注入到对象中才能使用",
            "components: {},",
            "data() {",
            "// 这里存放数据",
            "return {",
            "",
            "};",
            "},",
            "// 监听属性 类似于data概念",
            "computed: {},",
            "// 监控data中的数据变化",
            "watch: {},",
            "// 生命周期 - 创建完成（可以访问当前this实例）",
            "created() {",
            "",
            "},",
            "// 生命周期 - 挂载完成（可以访问DOM元素）",
            "mounted() {",
            "",
			"},",
			"// 方法集合",
            "methods: {",
            "",
            "},",
            "beforeCreate() {}, // 生命周期 - 创建之前",
            "beforeMount() {}, // 生命周期 - 挂载之前",
            "beforeUpdate() {}, // 生命周期 - 更新之前",
            "updated() {}, // 生命周期 - 更新之后",
            "beforeDestroy() {}, // 生命周期 - 销毁之前",
            "destroyed() {}, // 生命周期 - 销毁完成",
            "activated() {} // 如果页面有keep-alive缓存功能，这个函数会触发",
            "}",
            "</script>",
            "<style lang='scss' scoped>",
            "$4",
            "</style>"
        ],
        "description": "Log output to console"
    }
}

2.uni-app

{
    "Print to console": {
    //这里自定义快捷名称
        "prefix": "vue-uniApp",
        "body": [
            "<template>",
            "<view class='$2'>$5</view>",
            "</template>",
            "",
            "<script>",
            "",
            "export default {",
            "// import引入的组件需要注入到对象中才能使用",
            "components: {},",
            "data() {",
            "// 这里存放数据",
            "return {",
            "",
            "};",
            "},",
            "// 监听属性 类似于data概念",
            "computed: {},",
            "// 监控data中的数据变化",
            "watch: {},",
            "// 生命周期 - 创建完成（可以访问当前this实例）",
            "onLoad(options) {",
            "",
            "},",
            "// 生命周期 - 页面展示（不可以访问DOM元素）",
            "onShow() {",
            "",
            "},",
            "// 生命周期 - 挂载完成（可以访问DOM元素）",
            "onReady() {",
            "",
            "},",
            "// 方法集合",
            "methods: {",
            "",
            "},",
            "onHide() {}, // 生命周期 - 监听页面隐藏",
            "onUnload() {}, // 生命周期 - 监听页面卸载",
            "}",
            "</script>",
            "<style lang='scss'>",
            "$4",
            "</style>"
        ],
        "description": "Log output to console"
    }
}

3.使用，新建一个vue页面。然后直接输入vue-pc 就可以了