作為vue語法開發(fā)的跨平臺開發(fā)框架雖然愿望很美好熏兄，但是真的要實現(xiàn)跨平臺還是需要開發(fā)者搭建好的項目架構(gòu)忍疾，靈活運行vue語法和模塊化開發(fā)思維沸毁。
H5適配
官方創(chuàng)新很好问窃，又為我們創(chuàng)造了一個尺寸單位亥鬓，upx，但是考慮到項目遷移和開發(fā)通用域庇，我決定還是使用px配合flexible實現(xiàn)適配嵌戈，確保項目可以輕松移植到uni框架，需要改動@dcloudio/vue-cli-plugin-uni/packages/postcss文件听皿，在postcss.config.js文件中引入的熟呛，保證我們小寫px自動轉(zhuǎn)換rem，大寫的不轉(zhuǎn)換尉姨，默認采用750px的設(shè)計稿庵朝，所以其他尺寸設(shè)計稿的需要注意轉(zhuǎn)換：
利用條件編譯在main.js中引入flexible.js，這樣就可以實現(xiàn)H5的適配又厉，同時保證了我們的現(xiàn)有項目無縫升級到uni框架九府。當然在頁面js動態(tài)設(shè)置的px需要我們自己衡量是否需要適配，可以使用flexible自定義全局函數(shù)轉(zhuǎn)換rem覆致。其他小程序px轉(zhuǎn)換規(guī)則保持不變侄旬。
prop單向數(shù)據(jù)流特性
當我們對組件重復設(shè)置某些屬性為相同的值時，數(shù)據(jù)不會同步到view層煌妈。這就導致數(shù)據(jù)與視圖顯示不匹配儡羔，這時我們需要的是手動同步組件狀態(tài)，當組件內(nèi)部狀態(tài)改變時璧诵，對外觸發(fā)事件笔链，將新的狀態(tài)以參數(shù)的形式傳遞出去，這樣才能同步組件數(shù)據(jù)腮猖，父組件更改時鉴扫，子組件也就能更新視圖了。
子組件：$emit('事件名稱','數(shù)據(jù)')澈缺；
父組件：@事件名稱=“處理事件”
聲明周期那些事
首先我們需要清楚幾個概念坪创，應(yīng)用生命周期，頁面生命周期姐赡，還有組件生命周期：
應(yīng)用生命周期是項目啟動的過程莱预，主要是在App.vue中聲明的，包括下面幾個：
在onLanch中我們可以獲取啟動參數(shù)项滑，包括scene等依沮；其他的我們根據(jù)需要處理自己的邏輯。
頁面生命周期每個頁面單獨的生命周期，我們經(jīng)常會用到onLoad危喉，可以獲取頁面參數(shù)宋渔，當然我們可以自己封裝一層頁面組件，然后將頁面參數(shù)綁定到當前頁面實例$query辜限，保證了同vue一致的開發(fā)體驗皇拣。onReady代替vue的mounted，此時可以訪問頁面實例以及視圖結(jié)構(gòu)薄嫡。
組件生命周期區(qū)別于頁面生命周期氧急，沒有onShow，onLoad,但是vue的生命周期是支持的毫深，created等吩坝。
跨端注意
雖然框架提供跨端能力，但是各個平臺表現(xiàn)還是有些不一致的哑蔫，有時我們需要自己對齊钉寝，抹平平臺差異，保證開發(fā)一致鸳址。以下整理常見差異瘩蚪，并提供參考解決方案泉懦，作為我們開發(fā)時需要注意的：
1稿黍、頁面和組件的數(shù)據(jù)data聲明為方法返回一個對象，保證數(shù)據(jù)正確銷毀崩哩。
2巡球、開發(fā)統(tǒng)一采用vue語法的開發(fā)方式，模板數(shù)據(jù)綁定和事件監(jiān)聽邓嘹。
3酣栈、頭部導航欄建議采用自定義的方式，下拉刷新采用mescroll-uni版的汹押，體驗相對較好矿筝，而且可以自定義樣式，保證跨端開發(fā)以及表現(xiàn)一致棚贾。
4窖维、文件名或文件夾名中不允許出現(xiàn) @ 符號。canvas統(tǒng)一加id和canvas-id,v-if和v-for不要作用在用一個標簽上妙痹，必要時使用block或者template铸史。
5、圖片資源使用絕對路徑怯伊，背景圖片使用~@/static的絕對地址的方式琳轿。
6、暫時不支持跨端v-html模板語法，所以盡可能使用條件編譯在H5端使用崭篡。
7挪哄、目前測試在H5和微信小程序端可以使用過濾器和模板中使用自定義函數(shù)。
8媚送、組件里使用 slot 嵌套的其他組件時不支持 v-for中燥，動態(tài)組件，異步組件暫不支持塘偎，不支持自定義組件上原生事件疗涉，直接綁定style，class吟秩，keep-alive咱扣，transition等，建議不要使用v-show涵防。
9闹伪、微信中v-for在事件中使用item傳參時，訪問不到item壮池，但是可以使用索引傳遞偏瓤，目前官方標記為bug，暫時可以通過索引曲線實現(xiàn)椰憋。
