访问PropTypes已过时

Question

我使用的终极版，但是当我运行我的代码，我有这样的错误：

Accessing PropTypes via the main React package is deprecated. Use the prop-types package from npm instead.

我安装

npm i prop-types -S

但II仍然有相同的错误。

./components/action/article.js

import * as ArticleActionTypes from '../actiontypes/article'; 

export const AddArticle = (name, description, prix, image) => { 
    return { 
     type: ArticleActionTypes.ADD_ARTICLE, 
     name, 
     description, 
     prix, 
     image 
    } 
} 

export const RemoveArticle = index => { 
    return { 
     type: ArticleActionTypes.REMOVE_ARTICLE, 
     index 
    } 
} 

./components/actiontypes/article.js

export const ADD_ARTICLE = 'article/ADD_ARTICLE'; 
export const REMOVE_ARTICLE = 'article/REMOVE_ARTICLE'; 
export const UPDATE_ARTICLE = 'article/UPDATE_ARTICLE'; 

./components/reducers/article.js

import * as ArticleActionTypes from '../actiontypes/article'; 

const initialState = [ 
    { 
     name: 'test', 
     description: 'test', 
     prix: 'test', 
     image: 'url' 
    }, 
    { 
     name: 'test', 
     description: 'test', 
     prix: test, 
     image: 'url' 
    } 
] 

export default function Article (state=initialState, action){ 
    switch(action.type){ 
     case ArticleActionTypes.ADD_ARTICLE : 
      return [ 
       ...state, 
       { 
        name: action.name, 
        description: action.description, 
        prix: action.prix, 
        image: action.image 
       } 
      ]; 
     case ArticleActionTypes.REMOVE_ARTICLE : 
      return [ 
       ...state.slice(0, action.index), 
       ...state.slice(action.index +1) 
      ] ; 
     default: return state; 
    } 
} 

index.js

import React   from 'react'; 
import { render }  from 'react-dom'; 
import {Provider}  from 'react-redux'; 
import {createStore} from 'redux'; 

import ArticleReducer from './components/reducers/article'; 
import Scoreboard  from './components/containers/Scoreboard'; 

const store = createStore(
    ArticleReducer, 
    window.__REDUX_DEVTOOLS_EXTENSION__ && window.__REDUX_DEVTOOLS_EXTENSION__() 
) 

render(<Provider> 
      <Scoreboard store={store}/> 
     </Provider>, document.getElementById('root')); 

个

./components/containers/Scorboard.js

import React       from 'react'; 
import {connect}      from 'react-redux'; 
import {bindActionCreactors}   from 'redux'; 
import PropTypes      from 'prop-types'; 

class Scoreboard extends React.Component { 

    render(){ 
     return (
      <div> 
       Scoreboard 
      </div> 
     ) 
    } 
} 

const mapStateToProps = state => { 
    { 
     articles :state 
    } 
} 

Scoreboard.propTypes = { 
    articles: PropTypes.array.isRequired 
} 

export default connect(mapStateToProps)(Scoreboard); 

Answer 1

由于阵营v15.5.0 React.PropTypes的版本中使用，并已转移到另一个库。您应该使用npm install prop-types并从那里使用PropType。

./components/containers/Scorboard.js上的代码看起来非常好，您的代码中的其他位置可能有React.PropTypes。

另一种选择是，一些依赖您正在使用仍然使用旧的方式。你可以尝试更新你的依赖关系，但由于这种弃用是很新的，我怀疑每个库都已经发布了更新。

更多关于PropTypes细节弃用here。

UPDATE

好像终极版已经更新了它的依赖使用阵营v15.5.0和摆脱了弃用警告。它在v4和v5中也是固定的。

相关引入请求：#663和#666

Answer 2

正如其他人mentioned-如果你审计你自己的项目PropTypes用途，但你看到的仍然是很可能从上游的依赖来的警告 - 。您可以通过设置一个调试断点来记录此警告的原因，然后再回到调用程序。这里有一个简单的例子记录我做：（品质更高的版本可用here）

一旦你确定有问题的图书馆，考虑提出Github上的问题（或更好然后 - PR！）通知作者新的警告。

同时，这仅仅是一个开发模式的警告，因此应该不会影响应用程序的生产使用。

Answer 3

一定不要使用React.PropTypes，样品：

MyComponent.propTypes = { 
    MyString: PropTypes.string.isRequired 
} 

Answer 4

我解决了这个警告是这样的：

安装PropTypes

# npm install -S prop-types

进口PropTypes这样

import PropTypes from 'prop-types';

，而不是这样做：

import { PropTypes } from 'react';

Answer 5

只需运行 NPM安装道具类型

Answer 6

解决这个问题也一定要导入正确作出反应。我有这样的：

import * as React from 'react'; 

而且应该是：

import React from 'react'; 

这个固定我所有的警告。

Answer 7

您可以使用能够升级版本

修复

npm install --save react@15.4.0 react-dom@15.4.0