VSCode Vue 用户自定义开发模版 ( User Snippets )

 VSCode Vue 开发模版 

Ctrl+P

{

    "vue-template": {

        "prefix": "vue",

        "body": [

            "<template>",

            "  <div>",

            "  </div>",

            "</template>",

            "",

            "<script>",

            "// 这里可以导入其他文件(比如:其他组件,工具JS,json文件,图文件等等)",

            "//例如: import <组件名称> from  <组建路径>",

            "export default {",

            "//import 引入的组件需要注入到对象中才能使用",

            "components:{},",

            "props:{},",

            "data () {",

            "//这里存放数据",

            "    return {}",

            " },",

            "//计算机属性 类似与data概念",

            "computed:{},",

            "//监控data中数据变化",

            "watch:{},",

            "methods:{},",

            "//生命周期-创建完成(可以访问当前this实例)",

            "created() {",

            "},",

            "//生命周期-挂载完成(可以访问DOM元素)",

            "mounted() {",

            "},",

            "beforeCreate(){}, //生命周期-创建之前",

            "beforeMount(){}, //生命周期-挂载之前",

            "beforeUpdate(){}, //生命周期-更新之前",

            "Update(){}, //生命周期-更新之后",

            "beforeDestory(){}, //生命周期-销毁之前",

            "destroyed(){}, //生命周期-销毁完成",

            "activated(){}, //如果页面有keep-alive,这函数会触发",

            "}",

            "</script>",

            "",

            "<style scoped>",

            "//@import @url();  引入公共css",

            "</style>"

        ],

        "description": "my vue template"

    }

}

猜你喜欢

转载自blog.csdn.net/qq_35361859/article/details/109850374