首页 > 其他分享 >ReactNative新手入门,常见BUG

ReactNative新手入门,常见BUG

时间:2022-12-06 01:56:02浏览次数:68  
标签:info React Component 新手入门 导包 keyExtractor createClass BUG ReactNative

cannot add a child that doesn’t have a YogaNode …
布局文件编写错误,可能是布局文件中注视导致的.

cannot find variable React
需要导入React. import React, {Component} from ‘react’;

The development server returned response error code: 500

js代码出现问题,查看node黑框框是否提示错误信息,如果有,则是本地js代码出现错误
设置虚拟机的ip地址,ctrl+M打开开发者菜单,选择Dev Setting ,选择Debug server host & port for device ,设置ip地址和端口号 localhost:8081.
You likely forgot to export your component from the file it’s defined in, or you might have mixed up default and named imports.
导包错误导致的.需要判断导入的类是默认导包还是其他导包,默认导包不需要添加{},其他导包需要添加{}

warning: isMounted(…) is deprecated in plain JavaScript React classes.
在app入口文件index.js中使用

 

import RootStackNavigator from "./pages/navigator/RootStackNavigator";
YellowBox.ignoreWarnings(['Warning: isMounted(...) is deprecated', 'Module RCTImageLoader']);

 

VirtualizedList: missing keys for items, make sure to specify a key property on each item or provide a custom keyExtractor.
FlatList使用的时候,需要指定keyExtractor属性

 <FlatList
     ItemSeparatorComponent={() => this.renderItemSeparator()}
     enderItem={info => this._renderItem(info)}
     data={this.state.data}
     keyExtractor={(info) => this._keyExtractor(info)}
  />

 _keyExtractor(item, index) {
        return index+'';
 }

subscriptions[i] is not a function
函数需要绑定this,例如

this.onBackAndroid.bind(this)

 _react3.default.createClass is not a function
一些老的框架,使用的是下面的这种方式创建的Component,React最新版本抛弃使用了createClass这个函数,因此会提示错误.

var Popover = React.createClass() {
...
}
 module.exports = Popover; 

 这时候需要做一些修改,改成下面的方式创建Component

export default class Popover extends Component{
...
}

Possible Unhandled Promise Rejection (id: 0):
提示未处理的promise异常,例如使用await时,如果promise reject一个结果,那么会提示这个错误,并导致后面的代码得不到执行..这时候可以try…catch一下,或者catch处理一下,例如:

 async testError() {
        return Promise.reject('hello async error....');
 }
 async test() {
     let v2 = await this.testError().catch(err => {
                console.log(err);
      });
      console.log(v2);
  }

 

标签:info,React,Component,新手入门,导包,keyExtractor,createClass,BUG,ReactNative
From: https://www.cnblogs.com/sexintercourse/p/16954075.html

相关文章

  • React中的BUG记录——Error: Element type is invalid: expected a string (for built
    问题描述语法各个方面没有问题,报以下错误:Error:Elementtypeisinvalid:expectedastring(forbuilt-incomponents)oraclass/function(forcompositecomponents......
  • ReactNative踩坑之旅: Unable to resolve module 和 Error: Plugin
    原文:https://blog.csdn.net/j550341130/article/details/81027700具体流程请看这个,感谢分享:https://blog.csdn.net/qiyei2009/article/details/78820207我是在windo......
  • 让 iPhone 兼职网络摄像头 bug All In One
    让iPhone兼职网络摄像头bugAllInOne让iPhone兼职网络摄像头❌不好使,不稳定,连接不上连续互通相机让iPhone兼职网络摄像头iPhone强大的摄像头系统配合......
  • c++ - 误删cmake-build-debug ,clion具体解决
    1.背景误删了cmake-build-debug文件夹或者破会了内部文件2.解决如果cmake-build-debug文件夹删除了,需要在同一个文件添加这个文件夹如果cmake-build-debug文件夹还存在......
  • VS2022之DebuggerVisualizer
    在Debug程序时,面对一些大集合,之前是这样查看的,如下图,这样看起来不直观,集合中的数据只能一个一个实体查看: VS2022预览版带来一个新功能,集合表格可视化,比如下面这样......
  • VS2022之DebuggerVisualizer
    在Debug程序时,面对一些大集合,之前是这样查看的,如下图,这样看起来不直观,集合中的数据只能一个一个实体查看:  VS2022预览版带来一个新功能,集合表格可视化,比如下......
  • 汇编debug工具Dosbox使用
    汇编debug工具DOSBOX使用说明 首先新建文件,更改后缀名为asm,然后写入一段汇编程序 之后打开DosBox  输入masm+文件名(加不加文件名后缀都可以)但如果要加的话,应......
  • ReactNative XCode编译问题
    MacOSMonterey12.6.1+XCode14.1(14B47b)+模拟器iPhone11ios13.4启动步骤打开终端,yarnstart启动Metro服务打开XCode,打开项目中的ios文件夹下的.xcworks......
  • 修正fastreport for lazarus(linux)的Bug
    1、打开frxDsgnIntf.pas,第1243行:withGetTypeData(GetTypeData(PropertyList[i].PropType^).CompType^)^do改为:{$ifdefnotlinux}withGetTypeData(GetTypeData(Prop......
  • 修复zeosdbo-7.2.14-stable FindFirst和FindLast只有一条记录时返回false的Bug
    zeosdbo-7.2.14-stable/src/component/ZAbstractRODataset.pas将ZAbstractRODataset.pas第4396行改为(红字行):{Findsarecord.}SavedFilterEnabled:=FilterEna......