标签: native-module

React Native 中的本机模块:函数返回“未定义”

因此,我正在练习用 Java 制作本机模块,这些模块可以将函数暴露给 React Native 的 JavaScript 代码。为此,我决定使用一个简单的演示数学库。我的代码如下。

MathOpsModule.java

package com.mb_rn_poc;

import com.facebook.react.bridge.ReactContextBaseJavaModule;
import com.facebook.react.bridge.ReactMethod;

public class MathOpsModule extends ReactContextBaseJavaModule {

  @Override
  public String getName() {
    return "MathOps"; // Name of the Native Modules.
  }

  @ReactMethod
  public int add(int a, int b) {
    return (a + b);
  }
}
Run Code Online (Sandbox Code Playgroud)

MathOpsPackage.java

package com.mb_rn_poc;

import com.facebook.react.ReactPackage;
import com.facebook.react.bridge.NativeModule;
import com.facebook.react.bridge.ReactApplicationContext;
import com.facebook.react.uimanager.ViewManager;
import java.util.ArrayList;
import java.util.Collections;
import java.util.List;

public class MathOpsPackage implements ReactPackage {

@Override
public List<ViewManager> createViewManagers(
  ReactApplicationContext reactContext
) { …
Run Code Online (Sandbox Code Playgroud)

java react-native native-module react-native-native-module

9
推荐指数
1
解决办法
3924
查看次数

React Native获取电池状态/级别

我正在编写一个反应本机应用程序来获取IOS和Android电池状态.我在网上搜索,发现很少的库可以获得手机的电池电量.

https://github.com/robinpowered/react-native-device-battery

https://github.com/remobile/react-native-battery-status

https://github.com/oojr/react-native-battery

当我尝试这个时,每个库都有问题,而在git hub上提问时,对开发人员的支持不多.

任何人都可以为我提供更好的解决方案或库来获取IOS和Android的电池状态.

提前致谢

batterylevel react-native native-module react-native-native-module

8
推荐指数
2
解决办法
2598
查看次数

从本机代码调用 JavaScript 函数

我有一个 react-native 应用程序并希望将它与本机 SDK 集成。在某些时候,我需要调用 js 函数来返回数据,我应该从本机端进行这个调用。这是流程:

  1. 一些 iOS 处理程序需要更多信息
  2. native层调用js代码
  3. js 代码计算/获取所需数据
  4. js 代码将数据返回给本机代码
  5. 本机代码接收数据并继续工作

是否可以?有一个库,react-native-eval但可能有更优雅的方法来做到这一点?

ios react-native native-module react-native-ios

7
推荐指数
1
解决办法
2552
查看次数

什么是“本机模块工具”?帮助新手决定是否有必要(NodeJS 安装)

我刚刚开始我的 NodeJS 课程,该讲座是在 NodeJS 版本 10 时录制的(在 Mac 上)。我使用的是 Windows,现在是版本 16。本讲座不包含安装屏幕的此页面:

安装向导截图

摘要:我不知道我是否想要本机模块,或者它们是什么 - 但我不想要巧克力味。

我已经完成了我的研究,但我仍然找不到任何东西可以在任何地方为我解决以下问题。

1.我的问题:这些
原生模块 有多重要?我需要它们吗?或者您推荐它们,为什么?

2.Chocolatey:
出于兴趣,也许你可以告诉我为什么 NodeJS将原生模块和 Chocolatey捆绑在一起?

我决定不想要巧克力(没问题,如果我决定安装“工具”,那么我将进入 GitHub 并手动安装它们,如屏幕截图中所述。)

我不想要巧克力的原因是因为:根据我的研究,我认为我不需要巧克力,并且我发现卸载巧克力可能会导致我出现一两个问题,所以我会一起避免它 - 但我想我'我要顺便提一下,因为也许有人知道将它们捆绑在一起的一个非常有效的原因,这会改变我的想法。

非常感谢 Stack Overflow 社区。

javascript installation node.js chocolatey native-module

7
推荐指数
1
解决办法
7756
查看次数

如何在 React 中使用 RCTConvert

我是反应新手,正在研究反应桥接模块。我只是想知道 RCTConvert 有什么用处以及如何使用它。我正在关注这个网站 链接

请任何人帮助我了解这些东西。

objective-c ios react-native native-module bridging

6
推荐指数
1
解决办法
3959
查看次数

在ReactNative中创建android native模块时,“未定义不是函数”

我正在遵循ReactNative Native Module Guide来编写可在JS端使用的java类。导出的方法show来自类ToastModule(导出为ToastAndroid)。该show方法是如下:

public void show(String message, int duration) {
    Toast.makeText(getReactApplicationContext(), message, duration).show();
}
Run Code Online (Sandbox Code Playgroud)

当我从Button onPress处理程序调用ToastAndroid.show时,将显示所有与toast按钮一起预期的工作。

import React, { Component } from 'react';
import {
  AppRegistry,
  StyleSheet,
  Text,
  View,
  Button,
  NativeModules,
} from 'react-native';

const ToastAndroid = NativeModules.ToastAndroid

export default class App extends Component {

handleBTNPressed(){
  ToastAndroid.show('Awesome', ToastAndroid.SHORT);
}
render() {
  return (
    <View style={styles.container}>
      <Text style={styles.welcome}>
        Welcome to React Native!!
      </Text>
      <Button title='click me' onPress={()=>this.handleBTNPressed()}/>
    </View>
  );
 } …
Run Code Online (Sandbox Code Playgroud)

react-native native-module

6
推荐指数
1
解决办法
998
查看次数

反应本地WiFi列表

有没有一种方法可以使用Android和iOS的本机反应进行扫描并全部获取Wifi列表。我看过一些库,但大多数是android库,甚至那些库也无法正常工作。有什么建议么?

如果我需要编写本机模块,可以为我指出正确的方向。以前从未写过React Native的本地模块。

list wifi react-native native-module

6
推荐指数
1
解决办法
4979
查看次数

我在 JS 中看不到任何 iOS 本机模块

我对 React 有一些经验,但我是 React Native 的新手。我已经玩了一段时间,但是当我尝试为 iOS 编写一个基本的本机模块时,我被卡住了。我已经尝试过 Swift 和 Objective C。(我对 Swift 有一些基本的经验,但 Objective C 对我来说是全新的)

一些背景:

  1. 该项目是用 react-native-cli 2.0.1
  2. 我用 XCode 9.1

这是 .swift 类

import Foundation

@objc(Something)
class Something: NSObject {

  @objc
  func printSomething() -> Void {
    print("Something")
  }
}
Run Code Online (Sandbox Code Playgroud)

这是桥文件

#import <Foundation/Foundation.h>
#import <React/RCTBridgeModule.h>

@interface RCT_EXTERN_MODULE(Something, NSObject)

RCT_EXTERN_METHOD(printSomething)

@end
Run Code Online (Sandbox Code Playgroud)

和 Project-Brigding-Header.h

//
//  Use this file to import your target's public headers that you would like to expose to Swift.
//

#import <React/RCTBridgeModule.h>
Run Code Online (Sandbox Code Playgroud)

我的 App.js 文件 …

ios swift react-native native-module

6
推荐指数
1
解决办法
1056
查看次数

我们是否需要使用 React Native 0.60 运行 `pod install`?

我正在使用 React Native 0.60.5 并且正在链接这个模块。它说对于 React Native 0.60+,“CLI 自动链接功能在构建应用程序时链接模块”,所以我们需要运行的只是yarn add @react-native-community/async-storage.

但是,在描述自动链接的主页上,它说我们需要运行:

yarn add @react-native-community/async-storage cd ios && pod install && cd ..

我想知道的:

我们是否必须pod install使用 React Native 0.60+运行所有原生模块?

cocoapods reactjs react-native native-module react-native-native-module

6
推荐指数
1
解决办法
3万
查看次数

typeError: null 在访问 Native Module 时不是对象

我正在开发一个 React Native 应用程序并尝试从 android 访问本机模块。我正在关注这个官方文档 在此处输入链接描述

创建本机模块后,当我尝试在 javaScript 类中访问它时,它显示错误“typeError: null is not an object (Evaluating _ToastExample.default.show)”

ToastModule.java

package com.awesomeproject;

import android.widget.Toast;

import com.facebook.react.bridge.NativeModule;
import com.facebook.react.bridge.ReactApplicationContext;
import com.facebook.react.bridge.ReactContext;
import com.facebook.react.bridge.ReactContextBaseJavaModule;
import com.facebook.react.bridge.ReactMethod;

import java.util.Map;
import java.util.HashMap;

public class ToastModule extends ReactContextBaseJavaModule {
  private static ReactApplicationContext reactContext;

  private static final String DURATION_SHORT_KEY = "SHORT";
  private static final String DURATION_LONG_KEY = "LONG";

  ToastModule(ReactApplicationContext context) {
    super(context);
    reactContext = context;
  }

  @Override
  public String getName() {
    return "ToastExample";
  }

  @Override
  public Map<String, Object> …
Run Code Online (Sandbox Code Playgroud)

react-native native-module react-native-android react-native-native-module

5
推荐指数
1
解决办法
2391
查看次数