提供者中无效的子道具

Invalid prop children in Provider

本文关键字：无效 提供者      更新时间：2023-09-26

过去几周我一直在学习React。
首先使用React开发了一个简单的Chat，现在我开始将Redux集成到我的应用程序中。

我添加了一个简单的Action、一个匹配的Reducer(以及一个根Reducer)和一个Store。然后我到达了需要使用react-redux库中的Provider的部分:

import React from 'react';
import ReactDOM from 'react-dom';
import { Provider } from 'react-redux';
import { Router, browserHistory } from 'react-router';
import ConfigureStore from './Store/ConfigureStore';
import Routes from './Routes';
const store = ConfigureStore();
ReactDOM.render(
    <Provider store={store}>
        <Router history={browserHistory}
            routes={Routes} />,
    </Provider>,
    document.getElementById('root')
);

应用程序编译正常，但我在控制台收到以下错误:

警告:失败的道具类型:无效的道具children类型的array提供给Provider，期望一个单一的ReactElement。在供应商

和

未捕获的不变量违反:React. children .only期望接收一个React元素子元素。

我使用React Create App作为入门工具包。

在<Router history={browserHistory} routes={Routes} />之后有一个,

尝试删除它?

同样的错误:

警告:Failed prop type: Invalid prop children of type array提供给Provider，期望一个ReactElement。

Uncaught Error: React. children .only expected to receive a single React元素的孩子。

我想到了以下格式的提供商:

<Provider store={store}> <App4Connected /> </Provider>

可以正常工作:

<Provider store={store}>
    <App4Connected />
</Provider>

对我来说，以这种格式书写是抛出错误:

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

但这工作得很好:

ReactDOM.render(
    <Provider store={store}> 
        <App /> 
    </Provider>, 
    document.getElementById('root'));
相关文章：