1. 程式人生 > 其它 >vsCode-Vue程式碼片段

vsCode-Vue程式碼片段

複製貼上:

{
	"生成vue模板": {
		"prefix": "vue",
		"body": [
			"<template>",
			"<div></div>",
			"</template>",
			"",
			"<script>",
			"//這裡可以匯入其他檔案(比如:元件,工具js,第三方外掛js,json檔案,圖片檔案等等)",
			"//例如:import 《元件名稱》 from '《元件路徑》'",
			"",
			"export default {",
			"//import引入的元件需要注入到物件中才能使用",
			"components: {},",
			"props: {},",
			"data() {",
			"//這裡存放資料",
			"return {};",
			"},",
			"//計算屬性 類似於data概念",
			"computed: {},",
			"//監控data中的資料變化",
			"watch: {},",
			"//方法集合",
			"methods: {},",
			"//宣告週期 - 建立完成(可以訪問當前this例項)",
			"created() {},",
			"//宣告週期 - 掛載完成(可以訪問DOM元素)",
			"mounted() {},",
			"beforeCreate() {}, //生命週期 - 建立之前",
			"beforeMount() {}, //生命週期 - 掛載之前",
			"beforeUpdate() {}, //生命週期 - 更新之前",
			"updated() {}, //生命週期 - 更新之後",
			"beforeDestroy() {}, //生命週期 - 銷燬之前",
			"destroyed() {}, //生命週期 - 銷燬完成",
			"activated() {} //如果頁面有keep-alive快取功能,這個函式會觸發",
			"};",
			"</script>",
			"<style scoped>",
			"</style>",
		]
	}
}