В последней задаче вы создали хранилище Redux для обработки массива сообщений и создали действие для добавления новых сообщений. Следующим шагом будет предоставление доступа React к хранилищу Redux и действия, необходимые для отправки обновлений. React Redux предоставляет пакет react-redux для выполнения этих задач. React Redux предоставляет небольшой API с двумя ключевыми функциями: Provider и connect . Другая проблема connect . Provider - это оболочка из React Redux, которая обертывает ваше приложение React. Затем этот обертку позволяет вам получить доступ к функциям store Redux и функции dispatch во всем дереве компонентов. Provider берет два реквизита, магазин Redux и дочерние компоненты вашего приложения. Определение Provider для компонента приложения может выглядеть так:
<Магазин-провайдер = {store}>
<Приложение />
</ Provider>
The code editor now shows all your Redux and React code from the past several challenges. It includes the Redux store, actions, and the DisplayMessages component. The only new piece is the AppWrapper component at the bottom. Use this top level component to render the Provider from ReactRedux, and pass the Redux store as a prop. Then render the DisplayMessages component as a child. Once you are finished, you should see your React component rendered to the page.
Note: React Redux is available as a global variable here, so you can access the Provider with dot notation. The code in the editor takes advantage of this and sets it to a constant Provider for you to use in the AppWrapper render method.