簡介

阿里新出的weex，我一個做android的也過來湊個熱鬧，自己做了一個簡單的demo，是一個知乎新聞+日記的APP，功能比較簡單，代碼也是最基本的寫法和用法，初學(xué)weex的童鞋們可以參考使用學(xué)習(xí)一下。

使用方法

1、項目地址

2、配置環(huán)境

這個大家可以從weex官網(wǎng)去看。weex官網(wǎng)

3、運(yùn)行項目 terminal進(jìn)入到項目更目錄，執(zhí)行命令：

執(zhí)行腳本，把we文件編譯成js文件：

繼續(xù)執(zhí)行腳本，將上一步生成的js文件復(fù)制到android的項目中：

用AndroidStudio或者eclipse打開playground項目，好啦，這樣你就可以看到效果啦！

遇到的坑

下面這些問題就是我在做weextwo的時候遇到的問題。

1、運(yùn)行調(diào)試

我這里使用的方法其實就是講生成的js文件放到android中運(yùn)行的，當(dāng)然weex是支持類似RN那樣，pc作為服務(wù)器將生成的bundle分發(fā)到真機(jī)上，只要修改代碼，真機(jī)就可以立即看到結(jié)果。 不過weex文檔有點亂，所以相關(guān)東西還沒開始寫，大家可以去探究探究。

2、網(wǎng)絡(luò)請求

網(wǎng)絡(luò)請求返回的數(shù)據(jù)格式問題，這個主要是要會weex debug，對js加斷點，調(diào)試，還要主要method和created、ready是兩個范圍的函數(shù)（切忌不要把created方法寫到method中），method是你自己要定義的方法，created和ready是weex自帶的聲明周期方法。 因為weex還沒有很好的開發(fā)工具，所以我暫時用的webstorm，但是webstorm無法自動化we的格式，所以我當(dāng)時在寫第一個界面的時候就卡住了，一直沒有進(jìn)行我created中的方法，后面才發(fā)現(xiàn)，原來自己把created寫到method中去了，大家一定要注意了。

3、list的坑

list的每個item點擊傳入一個id的時候，通過var itemid = e.target.attr.newsid來獲取組件中newsid參數(shù)值，這種方式遇到一個非常非常奇葩的坑。就是如果這個組件是你自己定義的話，沒法獲取到，必須是要原生的組件才能獲取的到，具體原因還未查明。

4、文檔錯誤

1）webview和imageview的時候，src前面還有一個:，怪不得我開始一直檢查不到問題，還有目前webview好像還不支持顯示html的功能。

2）textarea和input中需要監(jiān)控change和input的時候，input的寫法是 oninput=“onTextAreaChange”，并不是文檔中那種寫法，試過，不行。

5、this的作用范圍

this的范圍不包括回調(diào)函數(shù)，所以如果要在回調(diào)函數(shù)中改變data中的數(shù)據(jù)，我們需要在函數(shù)中聲明一個局部變量，使self=this，這個self的作用范圍就在回調(diào)函數(shù)中。

6、storage問題 因為你存儲或者獲取的時候都是在回調(diào)函數(shù)中獲取的，這是一個異步的過程，所以你不能在執(zhí)行完一個函數(shù)之后，直接在下面的過程中，使用回調(diào)得到的結(jié)果，這個時候回調(diào)的結(jié)果可能還沒拿到，所以下面的過程都要放到回調(diào)函數(shù)中去。這個地方坑了我老半天。

需要解決的問題

效果

好了，最后我們看一下，我們app的運(yùn)行效果吧！

還有上拉和下拉刷新，我沒有截圖下來，大家可以去試試。

項目源碼