不推荐通过主React包访问PropTypes [英] Accessing PropTypes via the main React package is deprecated
问题描述
我正在使用redux但是当我运行我的代码时出现此错误:
I'm using redux but when I run my code I have this error:
不推荐通过主React包访问PropTypes 。改为使用来自npm的
prop-types包。
Accessing PropTypes via the main React package is deprecated. Use the prop-types package from npm instead.
我安装
npm i prop-types -S
npm i prop-types -S
但是II仍然有相同的错误。
but I I still have the same error.
./ components / action / article.js
./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
./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
./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
./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);
推荐答案
正如其他人所说 - 如果你已经审核过自己的项目为 PropTypes
使用,但您仍然看到警告 - 它可能来自上游依赖项。您可以通过设置调试断点来记录此警告的一种方法,然后逐步返回调用者。以下是我制作的快速录制示例:
As others have mentioned- if you have audited your own project for PropTypes
uses but you're still seeing the warning- it's likely coming from an upstream dependency. One way you can track down the cause of this warning is by setting a debug breakpoint where it's logged and then stepping back to the caller. Here's a quick example recording I made:
(可以使用更高质量的版本此处。)
(A higher-quality version is available here.)
一旦你确定了有问题的库,考虑提交一个Github问题(或者更好的是PR!)来告知作者新的警告。
Once you've identified the library in question, consider filing a Github issue (or better yet- a PR!) to inform the authors of the new warning.
同时,这只是一个开发模式警告,所以它不应该影响你的应用程序的生产使用。
In the meanwhile, this is only a dev-mode warning so it should not affect production usage of your application.
这篇关于不推荐通过主React包访问PropTypes的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!