Почему не работает connect в react-redux?

Question

[Itvanya]

Недавно мигрировал с Flux на Redux, вычитал теорию, долгое время пользовался сабскрайбами дабы отточить скилл. Вчера поставил react-redux для связки данных, но ничего не работает. Все сделано по принципу такому, как в офиц.документации.

const React = require('react');
const ReactDOM = require('react-dom');
const { createStore } = require('redux');
const { connect, Provider } = require('react-redux');

let initialState = {
    userName : 'Greg'
};

function simpleReducer(state=initialState) {
  return state;
}

class App extends React.Component {
    render () {
        console.log(this.props); // Никаких props от Provider не получено, хотя в карне программы React-tools его показывает
        return (
                <div></div>
        );
    }
}

let store = createStore(simpleReducer); // Делаем store из самого простого редюсера

function mapStateToProps(state) { // Адресация props в компонент
    return {
        userName : state.userName
    };
}

connect(mapStateToProps)(App); // После этого по идее props должны попасть в App, но ничего нет

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

Ребят, все выглядит правильно. В чем ошибка? Синтаксический сахар в виде декоратора проблемы не уменьшит. Спасибо.

Answer 1

[Mikhail Osher]

TL;DR: RTFM

Нет.
connect(...)(component) возвращает контейнер, который уже можно рендерить.

const Container = connect(mapStateToProps)(App); // После этого по идее props должны попасть в App, но ничего нет

ReactDOM.render(<Provider store={store}><Container /></Provider>, document.getElementById('root')); // Рендер

Comments

[Itvanya]

Mikhail Osher только что открыл доки и, действительно, пропустил) спасибо!