微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

React Native Admob无法正常工作-显示未找到RNGADBannerView

如何解决React Native Admob无法正常工作-显示未找到RNGADBannerView

import React,{ Component } from "react";
import {
  AppRegistry,StyleSheet,Text,View,FlatList,AsyncStorage,Button,TextInput,Keyboard,Platform
} from "react-native";
import {AdMobBanner} from 'react-native-admob';
const isAndroid = Platform.OS == "android";
const viewPadding = 10;

export default class TodoList extends Component {
  state = {
    tasks: [],text: "",};
  
 // componentDidMount(){
   // this.renderAdd() }
renderAdd(){
    
        return(
            <View style={{flex:1}}>
                <AdMobBanner
                adSize="banner"
                adUnitID="app-id"
                testdeviceid="EMULATOR"
                didFailToReceiveAdWithError={this.bannerError} />
            </View>
        );
  
}


  changeTextHandler = text => {
    this.setState({ text: text });
  };

  addTask = () => {
    let notEmpty = this.state.text.trim().length > 0;

    if (notEmpty) {
      this.setState(
        prevstate => {
          let { tasks,text } = prevstate;
          return {
            tasks: tasks.concat({ key: tasks.length,text: text }),text: ""
          };
        },() => Tasks.save(this.state.tasks)
      );
    }
  };

  deleteTask = i => {
    this.setState(
      prevstate => {
        let tasks = prevstate.tasks.slice();

        tasks.splice(i,1);

        return { tasks: tasks };
      },() => Tasks.save(this.state.tasks)
    );
  };

  componentDidMount() {
    Keyboard.addListener(
      isAndroid ? "keyboardDidShow" : "keyboardWillShow",e => this.setState({ viewMargin: e.endCoordinates.height + viewPadding })
    );

    Keyboard.addListener(
      isAndroid ? "keyboardDidHide" : "keyboardWillHide",() => this.setState({ viewMargin: viewPadding })
    );

    Tasks.all(tasks => this.setState({ tasks: tasks || [] }));
  }

  render() {
    return (
     
      <View
        style={[styles.container,{ paddingBottom: this.state.viewMargin },{backgroundColor: "#b8b811"}]}
      >
        <AdMobBanner
                adSize="banner"
                adUnitID="ca-app-pub-6268407821278608~9156268355"
                testdeviceid="EMULATOR"
                didFailToReceiveAdWithError={this.bannerError} />
     <Text style={{backgroundColor: "yellow"}}> To-do-list </Text>
      
        <FlatList
          style={styles.list}
          data={this.state.tasks}
          renderItem={({ item,index }) =>
            <View>
              <View style={styles.listItemCont}>
                <Text style={styles.listItem}>
                  {item.text}
                </Text>
                <Button title="Done" onPress={() => this.deleteTask(index)} />
              </View>
              <View style={styles.hr} />
            </View>}
        />
        <TextInput
          style={styles.textInput}
          onChangeText={this.changeTextHandler}
          onSubmitEditing={this.addTask}
          value={this.state.text}
          placeholder="Add Tasks"
          returnKeyType="done"
          returnKeyLabel="done"
        />
      </View>
      
    );
  }
}

let Tasks = {
  convertToArrayOfObject(tasks,callback) {
    return callback(
      tasks ? tasks.split("||").map((task,i) => ({ key: i,text: task })) : []
    );
  },convertToStringWithSeparators(tasks) {
    return tasks.map(task => task.text).join("||");
  },all(callback) {
    return AsyncStorage.getItem("TASKS",(err,tasks) =>
      this.convertToArrayOfObject(tasks,callback)
    );
  },save(tasks) {
    AsyncStorage.setItem("TASKS",this.convertToStringWithSeparators(tasks));
  }
};

const styles = StyleSheet.create({
  container: {
    flex: 1,justifyContent: "center",alignItems: "center",backgroundColor: "#F5FCFF",padding: viewPadding,paddingTop: 20
  },list: {
    width: "100%"
  },listItem: {
    paddingTop: 2,paddingBottom: 2,fontSize: 18
  },hr: {
    height: 1,backgroundColor: "gray"
  },listItemCont: {
    flexDirection: "row",justifyContent: "space-between"
  },textInput: {
    height: 40,paddingRight: 10,paddingLeft: 10,borderColor: "gray",width: "100%"
  }
});

AppRegistry.registerComponent("TodoList",() => TodoList);

这是我的代码。我通过使用react-native-admob得到以下错误。它的版本是^ 2.0.0-beta.6。我收到一条错误消息,指出未找到RNGADBannerVIew。请帮助解决错误。我什至尝试过博览会更新,但没有用。在此先感谢您的帮助。 https://i.stack.imgur.com/zGiJq.png

解决方法

Expo不允许您安装需要本机代码的外部库,而这一点可以做到。不过,似乎有一个Expo为Admob提供的软件包,您可以查看文档here

,

实际上我试图使用 react-native admob 但是我应该使用 expo admob 因为我的应用程序是在 expo 上而不是 react-native

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。