react-native添加Toast模块
1.创建⼀个原⽣模块开始。⼀个原⽣模块是⼀个通常继承 ReactContextBaseJavaModule 类的 Java 类,并且实现了 JavaScript 需要实现的⽅法
public class AliToastAndroid extends ReactContextBaseJavaModule {
private static final String DURATION_SHORT_KEY = "SHORT";
private static final String DURATION_LONG_KEY = "LONG";
public AliToastAndroid(ReactApplicationContext reactContext) {
super(reactContext);
}
@Override
public String getName() {
return "AliToastAndroid";
}
@Override
public Map<String, Object> getConstants() {
final Map<String, Object> constants = new HashMap<>();
constants.put(DURATION_SHORT_KEY, Toast.LENGTH_SHORT);
constants.put(DURATION_LONG_KEY, Toast.LENGTH_LONG);
return constants;
}
@ReactMethod
public void show(String message, int duration) {
Toast.makeText(getReactApplicationContext(), message, duration).show();
}
}
注意:
1.ReactContextBaseJavaModule 需要⼀个叫做 getName 的⽅法被实现。这个⽅法的⽬的就是返回在 JavaScript ⾥⾯表⽰这个类的叫做 NativeModule 的字符串的名字。在这⾥我们调⽤ AliToastAndroid
因此我们可以在 JavaScript ⾥⾯使⽤ React.NativeModules.AliToastAndroid 来得到它。
2.⼀个可选的叫做 getConstants 的⽅法会将传递给 JavaScript 的常量返回。这个⽅法的实现并不是必须的,但是却对在 JavaScript 和 Java 中同步的预定义的关键字的值⾮常重要。
3.给 JavaScript 暴露⼀个⽅法,⼀个 Java ⽅法需要使⽤ @ReactMethod 来注解。桥接的⽅法的返回值类型总是void。React Native 的桥接是异步的,因此将⼀个结果传递给 JavaScript 的唯⼀⽅式就是使⽤回调函数或者调⽤事件
2.注册模块:
public class AnExampleReactPackage extends MainReactPackage {
@Override
public List<NativeModule> createNativeModules(ReactApplicationContext reactContext) { List<NativeModule> modules = ateNativeModules(reactContext);
//new an Array intstead of abstract List exception
List<NativeModule> result = new ArrayList<>();
result.addAll(modules);
result.add(new AliToastAndroid(reactContext));
return result;
}
}
mReactInstanceManager = ReactInstanceManager.builder()
.setApplication(getApplication())
.setBundleAssetName("index.android.bundle")
.setJSMainModuleName("index.android")
.addPackage(new AnExampleReactPackage())
.setUseDeveloperSupport(BuildConfig.DEBUG)
reactnative开发.setInitialLifecycleState(LifecycleState.RESUMED)
.build();
3. 在你的 JavaScript ⽂件⾥⾯你可以像下⾯这样调⽤⽅法:
var AliToastAndroid = React.NativeModules.AliToastAndroid
AliToastAndroid.show('444444', AliToastAndroid.LONG);
版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。
发表评论