reactjs – 不推荐使用主React包访​​问PropTypes

前端之家收集整理的这篇文章主要介绍了reactjs – 不推荐使用主React包访​​问PropTypes前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我使用redux,但是当我运行我的代码我有这个错误

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

我安装

npm i prop-types -S

但我仍然有同样的错误.

./components/action/article.js

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

export const AddArticle = (name,description,prix,image) => {
    return {
        type: ArticleActionTypes.ADD_ARTICLE,name,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',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);
正如其他人所说 – 如果您已经对PropTypes使用的您自己的项目进行了审核,但是您仍然看到警告 – 它可能来自上游依赖关系.您可以通过设置一个调试断点来记录这个警告的原因,然后再回到调用者.以下是我录制的一个简单示例:

(更高质量的版本可用here.)

一旦您确定了有关的图书馆,请考虑提交Github问题(或更好的是PR!)来通知作者新的警告.

同时,这只是一种开发模式警告,因此不应影响应用程序的生产使用.

原文链接:https://www.f2er.com/react/301230.html

猜你在找的React相关文章