Question

我正在关注React教程here。在第四课中，我创建了一个App.propTypes部分。当我运行代码时，当我打开控制台时，React给我一个错误TypeError: Cannot read property 'string' of undefined，错误显示为React.PropTypes is deprecated since React 15.5.0, use the npm module prop-types instead。然后我继续安装了npm包prop-types并将其导入我的代码中，但我仍然遇到了同样的错误。我将在下面包含我的代码。

我使用的是节点版本 v8.5.0 。也许我应该尝试找出教程使用的节点版本，以便我的React版本匹配，但我甚至不知道我是否能找到它，我希望教程会指定这些类型的东西，它看起来像这个教程是2岁，这可能是我有这种差异的原因。

的src / app.js

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

class App extends React.Component{
  render(){
    let txt = this.props.txt
    return (
      <div>
        <h1>{txt}</h1>
        <b>bold</b>
      </div>
    )
  }
}

App.propTypes = {
  txt: React.PropTypes.string,
  cat: React.PropTypes.number.isRequired
}

export default App;

/src/index.js

import React from 'react';
import ReactDOM from 'react-dom';
import App from './App';

ReactDOM.render(
  <App cat={5} txt="this is the prop value" />, 
  document.getElementById('root')
);

Answer 1

更改

txt: React.PropTypes.string,
cat: React.PropTypes.number.isRequired

到

txt: PropTypes.string,
cat: PropTypes.number.isRequired

您从Prop-types中导入PropTypes PropTypes，因此不需要使用PropTypes作为React的属性。几个月前，不推荐使用PropTypes作为React的属性。

此外，您将cat标记为isRequired但不要在App组件中的任何位置使用它。这样会显示一个lint错误。

除此之外，我不确定问题是什么。我在我的机器上运行了你的源代码，结果没问题。

Answer 2

如果你正在使用prop-types包，你可以这样做：

App.propTypes = {
  txt: PropTypes.string,
  cat: PropTypes.number.isRequired
}

此外，你得到的错误是因为你没有猫作为道具进入任何地方。

Answer 3

我遵循了相同的教程并通过执行以下操作解决了这个问题。

第1部分

Prop-Types install
1. sudo npm -i -g prop-types
2. - 确保import PropTypes from 'prop-types';位于文件顶部。
3. 更改
  
  App.propTypes = { txt: React.PropTypes.string, cat: React.PropTypes.number.isRequired }
  
  到
  
  App.propTypes = { txt: PropTypes.string,//------------ remove React cat: PropTypes.number.isRequired//-- remove React }

第2部分

重新安装node_modules
1. 删除包 - 锁 .json NOT package.json
2. 运行sudo npm install
3. npm start

参考。 https://www.npmjs.com/package/prop-types

参考。 https://github.com/facebookincubator/create-react-app/issues/2534

Answer 4

也许你需要使用这个包here

不推荐使用React.PropTypes，我已经安装了prop-types包

4 个答案: