這次給大家?guī)淼氖荲ue.js如何劃分組件，這篇文章就給大家好好分析一下。

常見的一些頁面，大家坐在一起敲代碼就可以了，做完這個(gè)頁面再做別的頁面，但是作為一個(gè)功能復(fù)雜的系統(tǒng)，尤其是使用一些適合模塊化開發(fā)的框架，這樣會(huì)顯得效率很低，那么我們就單純的看在Vue里面如何劃分組件的。

總結(jié)下來有兩種可以劃分，兩種劃分的方法一種是頁面上的功能塊，select，pagenation,和一些需要大量代碼去實(shí)現(xiàn)的一些部分，我們可以把它提取出來放到一起或者分類。還有一種根據(jù)頁面區(qū)域來劃分,header,footer,sidebar，有了組件之后Vue的組件是怎么實(shí)現(xiàn)的？

APP.vue是項(xiàng)目的一個(gè)入口，而我們分好的組件也是一個(gè)對象，在APP.vue里面，我們把各個(gè)組件用import
導(dǎo)入，header指的是右邊的header.vue文件，這個(gè)寫法是es6的一個(gè)寫法，當(dāng)然如果不用不用es6組件化，也得用其他的一些requires來寫，進(jìn)行一個(gè)打包處理，如果只是把這兩個(gè)組件引入到app.vue
里面，在頁面中還是現(xiàn)實(shí) 不了這兩個(gè)組件的。

在Vue里面 必須通過components來注冊這個(gè)組件，把引入進(jìn)來的
放入，然后在模板層面上再來寫<header></header>和<footer></footer>，在渲染之后，模板層面會(huì)變成header.vue和footer.vue里面的內(nèi)容，有一點(diǎn)需要注意，Vue必須要去注冊才可以使用

介紹一下Vue組件之間的通信，秉承了一個(gè)概念，必須先要注冊，header.vue文件里面的代碼，假設(shè)我們里面有個(gè)data是username，然后方法是dothis，我們看到有一個(gè)屬性props,注冊了一個(gè)msg,當(dāng)我們的app.vue調(diào)用了header這個(gè)組件的時(shí)候，我們可以直接在header屬性里面寫msg，并且把a(bǔ)pp.vue里面任何的數(shù)據(jù)東西傳到header.vue里面，所有的都由Vue的機(jī)制去實(shí)現(xiàn)，如果header.vue這里沒有寫msg的話，是獲取不到屬性的。

相信看了以上介紹你已經(jīng)掌握了方法，更多精彩請關(guān)注風(fēng)君子博客其它相關(guān)文章！

相關(guān)閱讀：

關(guān)于HTTP/2服務(wù)器推送

nvm管理不同版本的node的方法

如何判斷CheckBox選中是否為空

以上就是Vue.js如何劃分組件的詳細(xì)內(nèi)容，更多請關(guān)注風(fēng)君子博客其它相關(guān)文章！

總結(jié)

以上是生活随笔為你收集整理的Vue.js如何划分组件(vue.js有什么用)的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。