setting vue templete in vs code

打开设置按钮

点击user snippet

输入vue

然后粘贴

{

"Print to console": {

"prefix": "vue3",

"body": [

"<!-- $0 -->",

"<template>",

" <div></div>",

"</template>",

"",

"<script lang='ts'>",

"import { reactive,toRefs,onBeforeMount,onMounted} from 'vue'",

"interface DataProps {}",

"export default {",

" name: '',",

" setup() {",

" console.log('1-开始创建组件-setup')",

" const data: DataProps = reactive({",

"" ,

" })",

" onBeforeMount(() => {",

" console.log('2.组件挂载页面之前执行----onBeforeMount')",

" })",

" onMounted(() => {",

" console.log('3.-组件挂载到页面之后执行-------onMounted')",

" })",

" const refData = toRefs(data);",

" return {",

" ...refData,",

" }",

"" ,

" }",

" };",

"</script>",

"<style lang='scss' scoped>",

"</style>",

],

"description": "Log output to console"

}

}

使用的时候直接输入vue就可以