React Native错误汇总(持续更新)

错误1 Element type is invalid…:

错误描述:
Element type is invalid: expected a String(for built-in components) or a class/function(for composite components) but got:object. check the render method of ‘….’


这个错误是很不容易发现的原因是由于ES5语法和ES6语法混乱搭配导致的。

ES5 语法 导出模块

module.exports = Page2;

ES5语法 引入模块

var NaviBar = require('./NaviBar');

ES6 导出语法

export  default class Page2 extends Component {

ES6 语法 导入模块

import NaviBar from './NaviBar';

两种语法混乱使用, 比如用ES6 导出 用ES5导入, 就可能会产生上述错误

错误2

错误描述:
cannot call a class as a function

这种错误一般都是手误导致的, 错误直译就是不能调用一个类作为一个函数。
这个错误一般情况下是不好找的,可以看到 错误详情第二部分指向的是ImageEquallyEnlarge.js 中的第11行, 这个文件是我创建的, 第11行是构造方法:

   constructor(props) {
        super(props);
        // 初始状态
        this.state = {
            //状态机变量是一个style, 它将被用于定义显示图片的样式
            style: {}
        };
        this.onImageLayout=this.onImageLayout.bind(this);
    }

而错误地方一般不是第11行导致的,
原因很多, 我只列举下我的错误原因:
这个文件我声明了一个名字叫ImageEquallyEnlarge的组件, 为了方便使用,我声明了两个属性:

//控件属性
ImageEquallyEnlarge.propTypes = {
    originalWidth: React.PropTypes.number.isRequired,
    originalHeight: React.PropTypes.number.isRequired
};

而产生的错误恰恰是因为这处我不小心写错了一个单词,propTypes写成了prototype

//控件属性
// 声明必须要有的图片原始宽度与高度
ImageEquallyEnlarge.prototype = {
    ...
};

这样就导致了上面的错误。 有时候越是粗心犯的错误越是不好解决, 大家开发的时候一定要细心。

错误4

错误描述
cannot read property ‘stringify’ of undefined


我们解析json对象是会用到stringify

let studentData = require('./data/student.json');
let newJSONString=JSON.stringify(studentData);

stringify是JSON对象中的方法, JSON是JS自带的API,不要在React Native中引入了。如果你引入JSON默认就指向了一个空的引用就会报这个错
所以千万不要在代码里这么写:

import React, {Component} from 'react';
import {
    AppRegistry,
    StyleSheet,
    View,
    Text,
    JSON  //不要写JSON
} from 'react-native';

更多精彩请关注微信公众账号likeDev,公众账号名称:爱上Android。

时间: 2024-09-16 18:23:41

React Native错误汇总(持续更新)的相关文章

LeetCode All in One 题目讲解汇总(持续更新中...)

终于将LeetCode的免费题刷完了,真是漫长的第一遍啊,估计很多题都忘的差不多了,这次开个题目汇总贴,并附上每道题目的解题连接,方便之后查阅吧~ 如果各位看官们,大神们发现了任何错误,或是代码无法通过OJ,或是有更好的解法,或是有任何疑问,意见和建议的话,请一定要在对应的帖子下面评论区留言告知博主啊,多谢多谢,祝大家刷得愉快,刷得精彩,刷出美好未来- 博主制作了一款iOS的应用"Leetcode Meet Me",里面有Leetcode上所有的题目,并且贴上了博主的解法,随时随地都能

iOS 文件及字符串相关操作汇总 - 持续更新中......

iOS 文件及字符串相关操作汇总 - 持续更新中...... 太阳火神的美丽人生 (http://blog.csdn.net/opengl_es) 本文遵循"署名-非商业用途-保持一致"创作公用协议 转载请保留此句:太阳火神的美丽人生 -  本博客专注于 敏捷开发及移动和物联设备研究:iOS.Android.Html5.Arduino.pcDuino,否则,出自本博客的文章拒绝转载或再转载,谢谢合作. 1.获取应用包中文件的绝对路径: NSString *absoluteFileNam

asp.net中ADO SQL数据库 笔记汇总 持续更新中_实用技巧

ADO连接数据库 1)获取连接字符串 方式一: 记住连接字符串 connectionString=" Integrated Security=True; server=. ; database=DBName" 方式二:在visual studio中,点击"视图"à服务资源管理器à右击左侧的"数据连接",选择"添加连接"à服务名: 为一个点.选择数据库名,然后点击"高级",然后复制底部的连接字符串 2)在we

MaxCompute常见错误汇总(更新ing)

从今天开始,小编会为大家陆续解读MaxCompute常见问题,帮助大家快速上手MaxCompute,玩转大数据计算平台,同时,也欢迎大家一起补充. 十大常见错误码 No1.FAILED: ODPS-0130131 报错信息:FAILED: ODPS-0130131:[1,15] Table not found - table test0517.dual cannot be resolved 用户场景:用虚拟表计算,select sum(1+1) from dual 问题分析:表不存在,MaxCo

React Native热更新及混合开发

随着 React Native 的不断发展完善,越来越多的公司选择使用 React Native 替代 iOS/Android 进行部分业务线的开发,也有不少使用 Hybrid 技术的公司转向了 React Native .虽然React Native在目前来说仍有不少的坑,不过对于以应用开发为主的App来说完全可以胜任. 概述 在iOS应用开发中,由于Apple严格的审核标准和低效率,iOS应用的发版速度极慢,这对于大多数团队来说是不能接受的,所以热更新对于iOS应用来说就显得尤其重要.而就在

阿里巴巴大数据计算平台MaxCompute(原名ODPS)全套攻略(持续更新20171122)

  概况介绍 大数据计算服务(MaxCompute,原名ODPS,产品地址:https://www.aliyun.com/product/odps)是一种快速.完全托管的TB/PB级数据仓库解决方案.MaxCompute向用户提供了完善的数据导入方案以及多种经典的分布式计算模型,能够更快速的解决用户海量数据计算问题,有效降低企业成本,并保障数据安全.本文收录了大量的MaxCompute产品介绍.技术介绍,帮助您快速了解MaxCompute/ODPS. MaxCompute 2.0:阿里巴巴的大数

看沃尔玛如何玩转 React Native

本文讲的是看沃尔玛如何玩转 React Native, 在沃尔玛,顾客总是第一位的,所以我们一直在寻找方法去改善我们给客户提供的购物体验.目前沃尔玛 app 有许多嵌入式的 Web 网页,我们发现这样的实现低于我们和我们的客户对这个应用程序的要求.即使在高端机上,这种混合 Web 视图实现的性能也不是很好,并且缺少了原生应用的感觉.不止如此,通过 Web 来访问非常依赖网络(我们使用服务器端呈现 Web),网络不好的用户会有不好的体验.因此,我们在思考:"有没有一种方法,能让我们修改或者替换现在

H5、React Native、Native应用对比分析

每日更新关注:http://weibo.com/hanjunqiang  新浪微博!iOS开发者交流QQ群: 446310206 "存在即合理".凡是存在的,都是合乎规律的.任何新事物的产生总要的它的道理:任何新事物的发展总是有着取代旧事物的能力.React Native来的正是时候,一则是因为H5发展到一定程度的受限:二则是移动市场的迅速崛起强调团队快速响应和迭代:三则是用户的体验被放大,用户要求极致的快感,除非你牛x(例如:12306最近修改手机号需要用户自己发短信接收验证码).

React Native热更新方案

一.目标 React Native热更新就是下载新RN包替换老RN包,那么我们需要考虑的点就是增量更新,要达到增量更新的目的,就需要把老RN包与新RN包的差异找出来,并且可以将这些差异与老RN包还原出新RN包.bsdiff和bspatch相关技术能实现我们的目标. 二.基本流程 1.服务器 使用bsdiff算法将老RN包和新RN包生成一个补丁patch文件,供客户端下载. 2.客户端 下载patch文件,使用bspatch算法将补丁patch文件和老RN包生成一个新RN包. 3.目前情况 暂时由