VUE 組件化、快速開發
vue的生命周期：
beforeCreate 組件剛剛被創建
created 組件創建之后
beforeMount 組件掛載之前
mounted 組件掛載之后
beforeDestroy 組件銷毀之前
destroyed 組件銷毀之后
vue安裝
首先要先安裝node.js，然后再安裝npm，然后換cnpm淘寶鏡像
由于使用cmd進入指定目錄非常不智能，因此推薦安裝git
去git官網下載，傻瓜式安裝即可
補充：git官網下載超級超級慢，推薦大家這個 https://npm.taobao.org/mirrors/git-for-windows/
安裝成功后進入專案目錄，右鍵-git bash here
全域安裝
cnpm install --global vue-cli
創建一個基于webpack模板的新專案
vue init webpack my_project
這樣代表安裝完成，查看專案
安裝依賴包
cd my_project
cnpm install
cnpm run dev
在瀏覽器訪問 localhost:8080
然后在編輯器打開專案，愛用啥編輯器就用啥，sublime也行，不過我最近比較喜歡vscode
在my_project的src目錄下，新建檔案夾pages，在pages下新建檔案夾demo1，在demo1下新建檔案index.vue
在index.vue里敲點代碼
然后打開router->index.js
這個檔案是用來設定路由的
瀏覽器訪問：
接下來修改index.vue的代碼，查看下各個周期函式
<template>
<div>hello cyy</div>
</template>
<script>
export default{
data(){
return {
}
},
beforeCreate(){
console.log("beforeCreate");
},
created(){
console.log("created");
},
beforeMount(){
console.log("beforeMount");
},
mounted(){
console.log("mounted");
},
beforeDestroy(){
console.log("beforeDestroy");
},
destroyed(){
console.log("destroyed");
}
}
</script>
轉載請註明出處，本文鏈接：https://www.uj5u.com/qiye/138835.html
標籤：JavaScript
下一篇：WEB前端第五十一課——BootStrap組件（三）dropdown、form、modal、pagination