本來(lái)想這一周做一個(gè)關(guān)于vuex的總結(jié)的，但是由于朋友反應(yīng)說(shuō)還不知道如何用vue去寫(xiě)一個(gè)組件，所以在此寫(xiě)寫(xiě)一篇文章來(lái)說(shuō)明下如何去寫(xiě)vue頁(yè)面或者組件。vue的核心思想就是組件，什么是組件呢？按照我的理解組件就是裝配頁(yè)面的零件，比如一輛車(chē)有大大小小許多零件組成，那么同樣的一個(gè)頁(yè)面，也是有許多組件構(gòu)成的比如說(shuō)頭部組件 按鈕組件等等，vue三大核心組件 路由 狀態(tài)管理，路由控制頁(yè)面的渲染，頁(yè)面由組件組成，數(shù)據(jù)有vuex進(jìn)行管理和改變。下面我會(huì)以一個(gè)簡(jiǎn)單的案例來(lái)說(shuō)
第一步：構(gòu)建一個(gè)簡(jiǎn)單的vue項(xiàng)目，老規(guī)矩直接在命令行輸入
vue init webpack myproject
cd my vue
cnpm/npm install
cnpm/npm run dev
執(zhí)行結(jié)果如下
然后你會(huì)在8080端口看到vue的標(biāo)志頁(yè)面
第二步：分析目錄結(jié)構(gòu) 主要是組件入口app.vue和main.js
第三步：寫(xiě)頁(yè)面
我們?cè)赼pp.vue下這樣寫(xiě)
<template>
<div id="wrapper">
<router-view></router-view>
</div></template><script>
export default {
data () { return {
}
},
components: {
}
}</script>