反应错误“失败的 propType:提供给”提供者“的无效道具'子项'，需要单个 ReactElement'

React error 'Failed propType: Invalid prop `children` supplied to `Provider`, expected a single ReactElement'

本文关键字：的无效道具 子项 ReactElement 单个 提供者 失败的 propType 失败 错误 无效      更新时间：2023-09-26

我对 React.js 有一些问题。这是我的代码：

import React from 'react';
import { createStore } from 'redux';
import { Provider } from 'react-redux';
import App from './containers/App';
import todoApp from './reducers';
let store = createStore(todoApp);
let rootElement = document.getElementById('root');
React.render(
    <Provider store={store}>
        {() => <App />}
    </Provider>,
    rootElement
);

并运行页面，它说：

失败的 propType：提供给Provider的无效 prop children，需要单个 ReactElement

这是我相关的已安装节点模块的列表：

  • 反应 15.0.1
  • React-redux 4.4.5
  • Redux 3.4.0

实际上，我目前正在学习 Redux 的 React，所以我很难怎么做。 我只是按照网站上的教程（我可以提供一个链接，但它不是英语），但它只是无法处理该错误消息。当我搜索时，有人说React和React-Redux的升级版本，但我安装了最新版本。任何建议将不胜感激。

根据文档，你可以只使用普通的 React 元素而不是 <Provider /> 中的函数。

因此，只需将代码更改为 

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

我认为自 react@0.14 以来情况发生了变化。

原来的问题有一个错别字。 您的响应在正确的语法中是正确的。

但是，直接原因是<App />需要在单独的行上。

如果你把它放在<Provider store={store}> React/Redux 试图用它做更多

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

我被带到了这里，我只是忘记提供道具。我会说确保您提供了组件正在使用的所有道具，并且应该可以修复它。

我有同样的错误，但这是在覆盖的情况下......对我有用的解决方案只是 删除组件道具之间的空格 .

例如：

<Overlay isVisible={global.ShowdispatchToDriverFlag} overlayStyle={{alignItems:"center",
                   justifyContent:"center",width:"95%",height:"95%",backgroundColor:"#ffffff"}}>

在上面，可见道具和覆盖样式之间有空格，删除了相同的空格，错误消失了。

相关文章：