本地模块是空对象

问题描述 投票:1回答:1

我制作了一个用于显示吐司的简单本机模块(android)。我已经将模块包添加到了ReactInstanceManager中。但是,当我登录NativeModules对象时,它仍然是空的。我曾尝试清理和重建项目,但NativeModules对象始终为空。我在下面附上代码。

SimpleToastModule.java

package com.example.shrijit.weteach11;
import android.widget.Toast;
import com.facebook.react.bridge.ReactApplicationContext;
import com.facebook.react.bridge.ReactContextBaseJavaModule;
import com.facebook.react.bridge.ReactMethod;

public class SimpleToastModule extends ReactContextBaseJavaModule {
    public SimpleToastModule(ReactApplicationContext reactContext) {
        super(reactContext);
    }

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

    @ReactMethod
    public void show(String message) {
        Toast.makeText(getReactApplicationContext(), message, Toast.LENGTH_SHORT).show();
    }
}

SimpleToastPackage.java

package com.example.shrijit.weteach11;
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 SimpleToastPackage implements ReactPackage {
    @Override
    public List<NativeModule> createNativeModules(ReactApplicationContext reactContext) {
        List<NativeModule> modules = new ArrayList<>();
        modules.add(new SimpleToastModule(reactContext));
        return modules;
    }

    @Override
    public List<ViewManager> createViewManagers(ReactApplicationContext reactContext) {
        return Collections.emptyList();
    }
}

MainActivity.java

package com.example.shrijit.weteach11;
import android.app.Activity; 
import android.os.Bundle; 
import android.support.v7.app.AppCompatActivity; 
import android.view.KeyEvent;
import com.facebook.react.ReactApplication; 
import com.facebook.react.ReactInstanceManager; 
import com.facebook.react.ReactNativeHost; 
import com.facebook.react.ReactPackage; 
import com.facebook.react.ReactRootView; 
import com.facebook.react.common.LifecycleState; 
import com.facebook.react.modules.core.DefaultHardwareBackBtnHandler; 
import com.facebook.react.shell.MainReactPackage;
import java.util.Arrays; import java.util.List;

public class MainActivity extends AppCompatActivity implements DefaultHardwareBackBtnHandler {
    private ReactRootView mReactRootView;
    private ReactInstanceManager mReactInstanceManager;

    @Override
    protected void onPause() {
        super.onPause();

        if (mReactInstanceManager != null) {
            mReactInstanceManager.onHostPause(this);
        }
    }

    @Override
    protected void onResume() {
        super.onResume();

        if (mReactInstanceManager != null) {
            mReactInstanceManager.onHostResume(this, this);
        }
    }

    @Override
    protected void onDestroy() {
        super.onDestroy();

        if (mReactInstanceManager != null) {
            mReactInstanceManager.onHostDestroy(this);
        }
        if (mReactRootView != null) {
            mReactRootView.unmountReactApplication();
        }
    }

    @Override
    public void onBackPressed() {
        if (mReactInstanceManager != null) {
            mReactInstanceManager.onBackPressed();
        } else {
            super.onBackPressed();
        }
    }

    @Override
    public boolean onKeyUp(int keyCode, KeyEvent event) {
        if (keyCode == KeyEvent.KEYCODE_MENU && mReactInstanceManager != null) {
            mReactInstanceManager.showDevOptionsDialog();
            return true;
        }
        return super.onKeyUp(keyCode, event);
    }

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);

        mReactRootView = new ReactRootView(this);
        mReactInstanceManager = ReactInstanceManager.builder()
                .setApplication(getApplication())
                .setBundleAssetName("index.android.bundle")
                .setJSMainModulePath("index")
                .addPackages(Arrays.asList(new MainReactPackage(), new SimpleToastPackage()))
                .setUseDeveloperSupport(BuildConfig.DEBUG)
                .setInitialLifecycleState(LifecycleState.RESUMED)
                .build();

        // The string here (e.g. "WeTeach11") has to match
        // the string in AppRegistry.registerComponent() in index.js
        Bundle initialProps = new Bundle();
        initialProps.putString("msg", "this is from android land");
        mReactRootView.startReactApplication(mReactInstanceManager, "WeTeach11", initialProps);

        setContentView(mReactRootView);
    }

    @Override
    public void invokeDefaultOnBackPressed() {
        super.onBackPressed();
    } 
}

App.js

import * as React from 'react';
import { View, DrawerLayoutAndroid, Prop } from 'react-native';
import { NativeRouter } from 'react-router-native';
import { Portal } from 'react-native-paper';
import md5 from 'react-native-md5';
import PropTypes from 'prop-types';

import DrawerMenu from './components/DrawerMenu';
import ToplevelView from './components/TopLevelView';
import {NativeModules} from 'react-native';

export class App extends React.Component {
  static propTypes = {
    msg: PropTypes.string,
  };

  constructor(props) {
    super(props);
    this.closeDrawer = () => {
      this.drawer.closeDrawer();
    };
    this.openDrawer = () => {
      this.drawer.openDrawer();
    };
  }

  componentDidMount() {
    //console.debug('props.msg:', this.props.msg);
    console.debug(NativeModules); // this is empty ie: {}
  }

  render() {
    var navigationView = (
      <View style={{ flex: 1, backgroundColor: '#dfdfdf' }}>
        <DrawerMenu closeDrawer={this.closeDrawer} />
      </View>
    );
    return (
      <Portal.Host>
        <NativeRouter>
          <DrawerLayoutAndroid
            ref={e => (this.drawer = e)}
            drawerWidth={300}
            drawerPosition={DrawerLayoutAndroid.positions.Right}
            renderNavigationView={() => navigationView}>
            <ToplevelView openDrawer={this.openDrawer} />
          </DrawerLayoutAndroid>
        </NativeRouter>
      </Portal.Host>
    );
  }
}

export default App;

有人可以指出我做错了什么吗?任何帮助都将受到赞赏。

react-native react-native-android
1个回答
0
投票

请确保您尚未使用expo来创建应用程序,不能将本机模块用于expo应用程序。在这里回答,因为我无法发表评论。

© www.soinside.com 2019 - 2024. All rights reserved.