Lỗi phản hồi 'Không thành công propType: Giá trị không hợp lệ `trẻ em` được cung cấp cho` Nhà cung cấp`, dự kiến ​​một ReactElement duy nhất'

Question

tôi có một số vấn đề với React.js. đây là mã của tôi:

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 
); 

và chạy trang, nó saids:

propType Không: prop không hợp lệ children cung cấp cho Provider, dự kiến ​​một ReactElement đơn

đây là danh sách các mô-đun nút được cài đặt có liên quan của tôi:

• phản ứng 15.0.1
• phản ứng-Redux 4.4.5
• Redux 3.4.0

trên thực tế, tôi hiện đang học tập Phản ứng với Redux, vì vậy rất khó để tôi làm thế nào tôi nên làm gì. tôi chỉ cần làm theo hướng dẫn trên trang web (tôi có thể cung cấp cho một liên kết, nhưng nó không phải là tiếng Anh) nhưng nó chỉ là không làm việc với thông báo lỗi đó. khi tôi tìm kiếm, ai đó đã nói phiên bản nâng cấp của phản ứng và phản ứng-redux, nhưng tôi đã cài đặt phiên bản mới nhất. mọi lời khuyên sẽ rất đánh giá cao nó.

Answer 1

Theo the doc, bạn chỉ có thể sử dụng phần tử React bình thường thay vì hàm bên trong <Provider />.

Kết quả là, chỉ cần thay đổi mã của bạn để

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

Tôi nghĩ rằng điều này đã thay đổi kể từ react@0.14.

Answer 2

Câu hỏi ban đầu có lỗi chính tả. Câu trả lời của bạn đúng theo cú pháp thích hợp.

Tuy nhiên, lý do trực tiếp là <App /> cần phải nằm trên một dòng riêng biệt.

Nếu bạn đặt nó trên cùng một dòng với <Provider store={store}> React/Redux sẽ cố gắng làm nhiều việc hơn mức cần thiết.

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