ReactJS「類型錯誤：無法讀取屬性的‘數組’未定義」

Question

在運行這段代碼我在App.propTypes

TypeError: Cannot read property 'array' of undefined

碼在第一行有錯誤：

class App extends React.Component { 
    render() { 
     return (
     <div> 
      <h3>Array: {this.props.propArray}</h3> 
      <h3>Array: {this.props.propBool ? "true" : "false"}</h3> 
      <h3>Func: {this.props.propFunc(3)}</h3> 
      <h3>Number: {this.props.propNumber}</h3> 
      <h3>String: {this.props.propString}</h3> 
      <h3>Object: {this.props.propObject.objectName1}</h3> 
      <h3>Object: {this.props.propObject.objectName2}</h3> 
      <h3>Object: {this.props.propObject.objectName3}</h3> 
     </div> 
    ); 
    } 
} 


App.propTypes = { 
    propArray: React.PropTypes.array.isRequired, //I got error over here 
    propBool: React.PropTypes.bool.isRequired, 
    propFunc: React.PropTypes.func, 
    propNumber: React.PropTypes.number, 
    propString: React.PropTypes.string, 
    propObject: React.PropTypes.object 
} 

App.defaultProps = { 
    propArray: [1,2,3,4,5], 
    propBool: true, 
    propFunc: function(e){return e}, 
    propNumber: 1, 
    propString: "String value...", 

    propObject: { 
     objectName1:"objectValue1", 
     objectName2: "objectValue2", 
     objectName3: "objectValue3" 
    } 
} 

我試圖尋找，但我沒有得到正確的解決方案。

Answer 1

道具類型中第一款規定，現在命名爲單獨維護庫prop-types 下面是從解釋react-docs：https://reactjs.org/docs/typechecking-with-proptypes.html

您必須將它們導入爲

import React from 'react'; 
import PropTypes from 'prop-types' 

class App extends React.Component { 
    //App here 
} 

App.propTypes = { 
propArray: PropTypes.array.isRequired, 
propBool: PropTypes.bool.isRequired, 
propFunc: PropTypes.func, 
propNumber: PropTypes.number, 
propString: PropTypes.string, 
propObject: PropTypes.object 
} 

NPM Package

Answer 2

React包不再包含PropTypes。您需要安裝prop-types包和

import PropTypes from 'prop-types'; 

編輯：正如documentation

React.PropTypes has moved into a different package since React v15.5. Please use the prop-types library instead.