gpt4 book ai didi

android - React-Native 原生 Android 模块 - Toast 示例

转载 作者:太空狗 更新时间:2023-10-29 13:03:40 25 4
gpt4 key购买 nike

我正在尝试学习使用 android native 模块并使用 react-native 文档中的 toast 示例。 (https://facebook.github.io/react-native/docs/native-modules-android)。但是,我遇到了一个问题,即我尝试导出的 native 模块无法解析/取消定义。

我的目录结构如下:

example
-android
-app
-src
-main
- java
-com
-example
-CustomToastPackage.java
-ToastModule.java
-MainActivity.java
-MainApplication.java
- res
- AndroidManifest.xml
-ios
-app.js
-index.js
-package.json

我的 index.js:

import {AppRegistry} from 'react-native';
import App from './App';
import {name as appName} from './app.json';

import {NativeModules} from 'react-native';//Added this

module.exports = NativeModules.ToastAndroidTutorial;//Added this

AppRegistry.registerComponent(appName, () => App);

还有我的 App.js

import React, {Component} from 'react';
import {Platform, StyleSheet, Text, View} from 'react-native';

import ToastExample from './ToastExample';//Added this


const instructions = Platform.select({
ios: 'Press Cmd+R to reload,\n' + 'Cmd+D or shake for dev menu',
android:
'Double tap R on your keyboard to reload,\n' +
'Shake or press menu button for dev menu',
});

type Props = {};
export default class App extends Component<Props> {
render() {
return (
<View style={styles.container}>

ToastExample.show('Awesome', ToastExample.SHORT);//Added this

<Text style={styles.welcome}>Welcome to React Native!</Text>
<Text style={styles.instructions}>To get started, edit App.js</Text>
<Text style={styles.instructions}>{instructions}</Text>
</View>
);
}
}

const styles = StyleSheet.create({
container: {
flex: 1,
justifyContent: 'center',
alignItems: 'center',
backgroundColor: '#F5FCFF',
},
welcome: {
fontSize: 20,
textAlign: 'center',
margin: 10,
},
instructions: {
textAlign: 'center',
color: '#333333',
marginBottom: 5,
},
});

这是我遇到的错误。

enter image description here

最佳答案

根据您显示的代码,这是因为您没有在 App.js 中正确导入模块,您应该创建一个名为 ToastExample.js 的文件与 App.js 在同一目录下,然后放置

import {NativeModules} from 'react-native';
module.exports = NativeModules.ToastExample;

如果在您的 ToastModule.java 中有

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

关于 getName() 方法。

关于android - React-Native 原生 Android 模块 - Toast 示例,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/51800550/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com