填书的坑(解决Cannot read property 'XXX

2018-10-14  本文已影响0人  兔子Tony的主人

说明:玩转全栈大记事系列文章写到9月17号时,工作发生了变动,中间停了一段时间。刚好那个时候卡在一个react的问题上,从这篇文章开始,会逐步把之前感觉困难的地方逐一梳理并写成文章。同时也会涉及到一些学习过程中填坑的文章。

注:出现Cannot read property 'XXX' of undefined这种报错的地方很多,我这里只是其中一种情况。

看的什么书

《深入浅出React和Redux》作者程墨
感谢作者,这本书讲了很多,我看过的视频,没有讲到的知识点,这些正是我需要的。
本文参考:https://www.jianshu.com/p/16a8f2d63ab3,作者:光强_上海

问题:

看到书中第21页的一段代码报错
源代码如下

Counter.propTypes = {
  caption: PropTypes.string.isRequired,
  initValue: PropTypes.number
};

花括号内两行都会报错,内容如下

Cannot read property 'XXX' of undefined

解决方法

造成这个报错的主要原因是React版本的问题
在React 15.5.0 之后的版本中,将PropTypes从React库中废除掉了,当我们需要使用PropTypes时,我们需从prop-types中导出PropTypes即可。
具体的步骤
1、执行npm install --save prop-types,安装prop-types
2、修改代码

//将
import React, { Component, PropTypes } from 'react';
//修改为
import React, { Component } from 'react';
import PropTypes from 'prop-types'

一些经验

从网上简单的搜素Cannot read property 'XXX' of undefined,很难得到真正能解决这个问题的答案
我最后找到答案用的搜索条件是

PropTypes.string.isRequired报错

总的来说,大多数时候,用报错信息比较容易得到解决问题的答案;但是,如果不能快速得到解决问题的方法,那么换个搜索条件,或许就是出路。

上一篇下一篇

猜你喜欢

热点阅读