資訊專欄INFORMATION COLUMN
摘要：剛看到這仨頁面的時(shí)候，我就想著可以用路由，做成三端統(tǒng)一。樣式這部分真的三端基本是高度統(tǒng)一的，部分微調(diào)一下就可以了，也正是這樣，我們后續(xù)才能迅速解決和。終于不是談?wù)勅私y(tǒng)一了，也是真的體驗(yàn)了一次，雖然最后有點(diǎn)出入，但是下次基本是沒問題了。
目錄
Weex系列(序) —— 總要知道原生的一點(diǎn)東東(iOS)
Weex系列(序) —— 總要知道原生的一點(diǎn)東東(Android)
Weex系列(1) —— Hello World項(xiàng)目
Weex系列(2) —— 頁面跳轉(zhuǎn)和通信
Weex系列(3) —— 單頁面還是多頁面
Weex系列(4) —— 老生常談的三端統(tǒng)一
[Weex系列(5) —— 封裝原生組件和模塊]
[Weex系列(6) —— css相關(guān)小結(jié)]
[Weex系列(7) —— web組件和webview]
[Weex系列(8) —— 是時(shí)候簡(jiǎn)析一下流程原理了]
[Weex系列(9) —— 踩坑填坑的集錦]
[Weex系列(10) —— 先這么多吧想到再寫。。。]
哎，手動(dòng)捂臉，真的是好忙的兩周，拔了一顆智齒、做了一個(gè)三端的投票活動(dòng)、參加了微信馬拉松比賽。還好都堅(jiān)持過來了，我怎么這么優(yōu)秀，還是手動(dòng)doge一下吧。
上面提到了一個(gè)三端投票活動(dòng)，之前還想著怎么寫這篇文章，做了這個(gè)活動(dòng)后，感覺有千言萬語。。
場(chǎng)景附上我們的 活動(dòng)鏈接 ，歡迎為自己喜歡的愛豆打call哦。APP端，歡迎搜索 黑貓投訴 或 新浪眾測(cè) 呦，點(diǎn)擊banner都可以雙倍投票呢。對(duì)，這兩個(gè)app都是基于weex做的。
打開活動(dòng)頁，可以看到就三個(gè)頁面，首頁、明星詳情頁、明星列表頁。剛看到這仨頁面的時(shí)候，我就想著可以用路由，做成三端統(tǒng)一。
配置看過我前一篇的文章，就知道我們的app都是多頁面的，webpack只會(huì)打包成多個(gè)js，按照我上面的思路，這個(gè)時(shí)候需要修改配置，做過vue大型項(xiàng)目的應(yīng)該遇到過吧，我之前是沒有弄過，花了半天時(shí)間，參考的是已有的app多頁面配置，和新建的只有單頁面項(xiàng)目的配置，終于修改好了配置文件。（這里的單頁多頁可以參考我的前一篇文章）。
然后就把靜態(tài)的三個(gè)頁面切好了，在app端和web樣式基本都是正常的。
如果你用的是最近的weex腳手架，web的index.html里面需要引入dist目錄里面對(duì)應(yīng)的index.web.js和vendor.web.js，而不是網(wǎng)上weex-hackernews-master項(xiàng)目里面引的weex-vue-render等js。（不然是不能多帶帶運(yùn)行的）
vendor.web.js里面兼容了我們使用的weex組件和模塊，有興趣的可以去研究一下。
開始其實(shí)還挺順利的，但是中間遇到了很多問題，主要列出以下幾點(diǎn)吧
封裝的模塊和組件剛開始拿到項(xiàng)目的時(shí)候，想的還是少了。weex只是處理了他支持的組件和模塊，所以我們自己封裝的就需要自己做兼容了/(ㄒoㄒ)/~~。
這里要說的一點(diǎn)是weex-ui也是處理過了，比如wxc-slider-bar三端基本無差異。
比如我們這邊的登錄模塊，h5是一套登錄組件，app里面是微博的登錄模塊。由此還牽扯的有相關(guān)的請(qǐng)求方法、后端接口處理等。
樣式這部分真的三端基本是高度統(tǒng)一的，部分微調(diào)一下就可以了，也正是這樣，我們后續(xù)才能迅速解決h5和pc。
總結(jié)上面模塊那部分由于涉及項(xiàng)目，我是簡(jiǎn)單幾筆帶過，其實(shí)這塊真的是挺麻煩的，祝大家順利吧。
這次我們是有pc、h5、兩個(gè)app的兩端，其實(shí)是6端，時(shí)間也是挺緊的，所以最后基本還是h5、pc維護(hù)一套，app再維護(hù)一套。
終于不是談?wù)勅私y(tǒng)一了，也是真的體驗(yàn)了一次，雖然最后有點(diǎn)出入，但是下次基本是沒問題了(doge)。
想用但還沒有去實(shí)踐過的，真的可以去試試了。
最后歡迎評(píng)論交流學(xué)習(xí)啊，如果喜歡就請(qǐng)點(diǎn)個(gè)贊~~
文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請(qǐng)注明本文地址：http://systransis.cn/yun/100186.html
摘要：由于最開始沒有一點(diǎn)點(diǎn)原生開發(fā)的經(jīng)驗(yàn)，所以我就直接用的腳手架初始化項(xiàng)目。那下面我們就從最最原始的項(xiàng)目開始吧，序篇太枯燥，自由發(fā)揮時(shí)間開始啦。執(zhí)行如下代碼，最后會(huì)得到如圖的項(xiàng)目結(jié)構(gòu)。入口文件等簡(jiǎn)析進(jìn)行了初始化。 目錄 Weex系列(序) —— 總要知道原生的一點(diǎn)東東(iOS) Weex系列(序) —— 總要知道原生的一點(diǎn)東東(Android) Weex系列(1) —— Hello Wor...
摘要：方法接口什么的直接移除，真是個(gè)狠人啊，這個(gè)只能大家一個(gè)個(gè)文件去改嘍，官網(wǎng)鏈接比如我這邊是把換成安卓升級(jí)相關(guān)升級(jí)之前先來解釋個(gè)吧原文章是告訴用哪個(gè)版本編譯應(yīng)用程序。應(yīng)該強(qiáng)調(diào)的是，更改不會(huì)改變運(yùn)行時(shí)行為。是提供向前兼容的主要依據(jù)。 目錄 Weex系列(序) —— 總要知道原生的一點(diǎn)東東(iOS) Weex系列(序) —— 總要知道原生的一點(diǎn)東東(Android) Weex系列(1) ——...
摘要：方法接口什么的直接移除，真是個(gè)狠人啊，這個(gè)只能大家一個(gè)個(gè)文件去改嘍，官網(wǎng)鏈接比如我這邊是把換成安卓升級(jí)相關(guān)升級(jí)之前先來解釋個(gè)吧原文章是告訴用哪個(gè)版本編譯應(yīng)用程序。應(yīng)該強(qiáng)調(diào)的是，更改不會(huì)改變運(yùn)行時(shí)行為。是提供向前兼容的主要依據(jù)。 目錄 Weex系列(序) —— 總要知道原生的一點(diǎn)東東(iOS) Weex系列(序) —— 總要知道原生的一點(diǎn)東東(Android) Weex系列(1) ——...
閱讀 2298·2021-09-28 09:36
閱讀 2143·2021-09-22 15:14
閱讀 3664·2019-08-30 12:47
閱讀 3058·2019-08-30 12:44
閱讀 1266·2019-08-29 17:06
閱讀 564·2019-08-29 14:12
閱讀 1007·2019-08-29 14:01
閱讀 2604·2019-08-29 12:17
