摘要:本身是事件驅動的語言,需在中可以使用回調方法來處理函數返回的結果。同樣地在中定義了和的接口,用來處理調用方法的回調。是中增加的對于異步編程和回調更加友好的使用可以更簡潔,更靈活地處理回調。
在react-native中可以通過在java層自定義ReactMethod(https://segmentfault.com/a/1190000004486024)方式給JavaScript調用,這樣在JavaScript層就可以直接調用Android中的Native方法.
但在大部分的方法調用中,都需要知道調用方法之后的處理結果是什么,有沒有出現異常等情況。JavaScript本身是事件驅動的語言,需在JavaScript中可以使用回調方法來處理函數返回的結果。同樣地在react-native中定義了Callback和Promise的接口,用來處理JavaScript調用Java方法的回調。
Callback是react.bridge中的一個接口,它作為ReactMethod的一個傳參,用來映射JavaScript的回調函數(function)。Callback接口只定義了一個方法invoke,invoke接受多個參數,這個參數必須是react.bridge中支持的參數。
首先我們定義一個類用來給JavaScript調用:
public class StoreModule extends ReactContextBaseJavaModule { @Override public String getName() { return "StoreModule"; } }
指定其名稱為StoreModule。
下面我們一定個方法,用來保存userName和password到ShardPreferences中,在這個方法中,我們需要定義兩個Callback參數,一個用來處理成功的情況,一個用來處理異常的情況。
@ReactMethod public void addUser(String userName, String password, Callback successCallback, Callback errorCallback) { try { if (TextUtils.isEmpty(userName)) { errorCallback.invoke("user name is empty"); return; } if (TextUtils.isEmpty(password)) { errorCallback.invoke("password is empty"); return; } preferences.edit().putString(USER_NAME, userName).commit(); preferences.edit().putString(PASSWORD, password).commit(); successCallback.invoke("add user success"); } catch (Exception e) { e.printStackTrace(); errorCallback.invoke(e.getMessage()); } }
現在我們有了一個帶有Callback作為參數的StoreModule類,把這個類的實例加入ReactPackage的createNativeModules中,就可以在JavaScript層調用該方法。
在JavaScript中,調用這個帶有Callback參數的方法:
var {NativeModules}=require("react-native"); var storeModule=NativeModules.StoreModule; storeModule.addUser("jjz","123456",(msg)=>{ alert(msg); },(errorMsg)=>{ alert(errorMsg) });
這里的方法回調方法我們都是使用的匿名函數,在JavaScript調用Java之后,處理結果會以Callback的形式回到JavaScript中,在JavaScript中再對相應的結果進行處理。
PromisePromise是ES6中增加的對于異步編程和回調更加友好的API(https://segmentfault.com/a/1190000004505028),使用Promise可以更簡潔,更靈活地處理回調。
在react.briage中定義的Promise接口,實現了resolve和reject的方法,resolve用來處理正確處理結果的情況,reject用來處理異常的情況。
在StoreModule定義一個支持Promise作為參數的方法:
@ReactMethod public void login(String userName, String password, Promise promise) { String storeUserName = preferences.getString(USER_NAME, ""); String storePassword = preferences.getString(PASSWORD, ""); if (!equalsString(userName, storeUserName)) { promise.reject("0", "user name is wrong"); return; } if (!equalsString(password, storePassword)) { promise.reject("1", "password is wrong"); return; } WritableMap map = Arguments.createMap(); map.putDouble("user_id", 1); promise.resolve(map); }
這里的WritableMap繼承了ReadableMap,定義了Java和JavaScript中的參數轉換.
調用這個方法的時候,在JavaScript中會返回一個Promise對象,這意味著你可以JavaScript直接使用。
在JavaScript中調用:
storeModule.login("jjz","123456").then((map)=>{ alert(map["user_id"]); },(code,message)=>{ alert(message); })
使用Promise比使用Callback更加的簡潔,還能更加靈活的在多線程之間進行切換。
代碼地址:https://github.com/jjz/react-native/tree/master/RNJava
文章版權歸作者所有,未經允許請勿轉載,若此文章存在違規行為,您可以聯系管理員刪除。
轉載請注明本文地址:http://specialneedsforspecialkids.com/yun/78778.html
摘要:但阿里百川并沒有提供直接獲取數據的方法,所以選擇時一定要慎重。 React-native 使用native第三方sdk ios(以阿里百川用戶反饋為例) 首先安裝cocopods(類似于npm,ios開發的依賴管理工具,教程:http://www.code4app.com/artic... 在ios根目錄下創建Podfile文件,添加如下代碼(使用的是百川feedback1.1.1版...
摘要:原方式中是經過壓縮的腳本文件,預編譯后則是二進制文件。兩者影響疊加導致整體減小,包大小得到優化。引擎包引擎包官方文檔中對內存區的描述您的應用用于處理代碼和資源如字節碼已優化或已編譯的碼庫和字體的內存。本文首發自普惠出行產品技術 自從 Google 的 Flutter 發布之后,Facebook 對 React-Native 的迭代開始快了起來,優化 React-Native 的性能表現...
摘要:傳給回調函數的里,包含一個觸摸事件參數。官網的版文檔中,和組件中都有屬性,這個屬性接收一個回調函數,函數原型是,在組件和的組件的時候觸發該事件,傳給回調函數的里,參數,其中的屬性為該組件的。 1、問題 問題場景: 由于手機屏幕高度不定,做表單頁面時,外層通常加上ScrollView組件,使其能夠適應屏幕進行滾動。業務需要里面放置多個TextInput組件。 問題描述: 出現的問題是,首...
閱讀 1631·2021-10-27 14:13
閱讀 1868·2021-10-11 10:59
閱讀 3367·2021-09-24 10:26
閱讀 1925·2019-08-30 12:48
閱讀 3041·2019-08-30 12:46
閱讀 2033·2019-08-30 11:16
閱讀 1414·2019-08-30 10:48
閱讀 2740·2019-08-29 16:54