Provider 中的无效道具 children

Question

过去几周我一直在学习 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')
);

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

Warning: Failed prop type: Invalid prop children of type array supplied to Provider, expected a single ReactElement. in Provider

和

Uncaught Invariant Violation: React.Children.only expected to receive a single React element child.

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

可以找到完整代码 here。

Answer 1

您在 <Router history={browserHistory} routes={Routes} />

之后有一个 ,

尝试删除它？

Answer 2

同样的错误：

Warning: Failed prop type: Invalid prop children of type array supplied to Provider, expected a single ReactElement.

Uncaught Error: React.Children.only expected to receive a single React element child.

我在编写 Provider 时遇到这种格式：

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

以下内容可以正常工作：

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

Answer 3

对我来说，以这种格式写作会引发错误：

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

但这很好用：

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

Provider 中的无效道具 children

Invalid prop children in Provider

javascript

reactjs

redux

react-redux