組件化開發之vue

今天寫了寫vue的組件化開發demo，有些小的心得。分享一下。

組件化意味着代碼能夠複用，調用組件就能夠了。而後能夠經過組件調用組件的相關能力。

例如之前我作組件化開發的一個小項目

 

原生js組件的實現

這就是一個網站了，網站分割成以頁面爲一級單位，組件爲二級單位的一個格局，而後調用addPage(),addComponent()方法便可去生成網站，固然爲了實現這個想法，我花了大概一週的時間，並且用了fullpage和jquery，若是用js去開發的話估計是上天的節奏。看完這個我以爲個人組件更相似於插件，由於這個組件集成的功能太多了

這是其中的一個頁面，組件實現了動畫，dom，數據，重點是和fullpage是嚴重耦合的。也不能說不能夠耦合，就是很差這個組件庫限制多了一層。很差去使用他了。

 

vue的組件

vue作得比較不錯的一點就是組件化開發，廢話很少說，直接上代碼

 

首先假如後臺取到的數據是這個樣子的，而咱們生成的代碼是下邊那種。

 

因而乎咱們就會去寫代碼，下邊那種，兩個組件，注入兩條數據。

 

組件下邊那樣子，經過v-for去拿到數據，展現出來

 

而後vue中間結合，把數據放入做用域，做用域內能夠調用數據。

這樣就搞定了，模板搭建，提供數據接口，vue把數據寫入做用域，做用域內的組件拿到數據就ok了。而後造成html+數據的組件開發