React + Redux, почему не передаются данные?

Добрый день, не передаются данные, делаю все правильно вроде, но не получаю данных:
Создание хранилища и рендеринг компонента
import React from "react";
import ReactDOM from "react-dom";
import { Provider } from "react-redux";
import { ListProject } from "./Components/Projects";
import { rootReducer } from "./Reducers/reducers";
import { createStore } from "redux";

export const store = createStore(
	rootReducer, 
	window.__REDUX_DEVTOOLS_EXTENSION__ && window.__REDUX_DEVTOOLS_EXTENSION__()
);

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

Редусер
const initialState = {
  projects: ["Projects 001"]
};

export function rootReducer(state = initialState) {
  	return state;
}

Сам компонент с конектом
import React, { Component } from "react";
import { connect } from "react-redux";

export const ListProject = (props) => {
	console.log(props.projects);
    return <div>Привет из App, { props.projects }!</div>
}

const mapStateToProps = (state) => {
	projects: state.projects
}

export default connect(mapStateToProps)(ListProject);

Посмотрел много примеров везде передают данные в методе коннект, но у меня не работает, в чем может быть причина? Хранилище создается, редюсер работает.
  • Вопрос задан
  • 86 просмотров
Решения вопроса 1
rockon404
@rockon404
Frontend Developer
Исправьте:
const mapStateToProps = (state) => {
  projects: state.projects
}

на:
const mapStateToProps = (state) => ({
  projects: state.projects
});

JavaScript парсер, в вашем случае, распознает фигурные скобки ни как возвращаемый функцией объект, а как тело блока функции, которая ничего не возвращает. Чтобы возвращать объект в короткой записи его необходимо заключать в скобки.
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через TM ID
Похожие вопросы