Javascript React.PropTypes已弃用，我已安装了PropTypes包

我正在学习一个React教程。在第四课中，我创建了一个

App.propTypes

部分。当我运行代码React时，会出现一个错误，显示为

TypeError:无法读取未定义的属性“string”

当我打开控制台时，错误显示

React.PropTypes自React 15.5.0以来已被弃用，请改用npm模块prop types

。然后我继续安装了npm包并将其导入到我的代码中，但最终还是出现了相同的错误。我将在下面包含我的代码

我使用的是节点版本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;

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')
);

从“React”导入React；
从“道具类型”导入道具类型；
类应用程序扩展了React.Component{
render（）{
设txt=this.props.txt
返回(
{txt}
大胆的
)
}
}
App.propTypes={
txt:React.PropTypes.string，
类别：React.PropTypes.number.isRequired
}
导出默认应用程序；

/src/index.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;

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')
);

从“React”导入React；
从“react dom”导入react dom；
从“./App”导入应用程序；
ReactDOM.render(
, 
document.getElementById（'root'））
);

如果您使用的是道具类型软件包，您可以执行以下操作：

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

另外，你得到的错误是因为你还没有猫作为道具出现在任何地方

变化

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

到

您已将PropTypes作为PropTypes从“prop types”导入，因此无需将PropTypes用作React的属性。几个月前，使用PropTypes作为React的属性已被弃用

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

---

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

也许您需要使用此软件包

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

第1部分

• 道具类型安装

• sudo npm-i-g道具类型

• 在App.js中
  • 确保

    从“道具类型”导入道具类型位于文件的顶部

• 改变

  App.propTypes={
  txt:React.PropTypes.string，
  类别：React.PropTypes.number.isRequired
  }

  到

  App.propTypes={
  txt:PropTypes.string，//-----------删除
  cat:PropTypes.number.isRequired//--删除
  }

第二部分

• 重新安装节点单元模块

• 删除包-锁定.json而不是package.json
• 运行

  sudo npm安装
  

• npm启动

参考文献

---

参考

txt:React.PropTypes.string

=>

txt:PropTypes.string