0

Пытаюсь подключить через конект свой функциональный компонент. Использую Redux. Подскажите где ошибка, не пойму немного. Error : mapDispatchToProps() in Connect(Users) must return a plain object. Instead received undefined. - как зафиксить?

   import React, { Component } from "react";
import { connect } from "react-redux";
import {
  setResourcesLoading,
  setUsersData,
  setResourcesError
} from "../store/modules/users";

const Users = props => {

  const generateUserId = url => {
    const urlId = url.substring(url.length - 2, url.length - 1);
    const id = "userId" + urlId;
    return [id, urlId];
  };
  const getUserData = () => {
    setResourcesLoading();
    fetch("https://swapi.co/api/people/")
      .then(results => {
        return results.json();
      })
      .then(data => {
        data.results.map(user => {
          const idUrlId = generateUserId(user.url);
          const [urlId] = idUrlId;
          return { user, urlId };
        });
      });
  };
  const { loading } = props;
  return (
    <div>
      <span>{loading ? <div>isLoading...</div> : <div>good</div>}</span>
      <button onClick={props.setUsersData}>2</button>
    </div>
  );
};

const mapStateToProps = ({
  users: {
    resources: { loading }
  }
}) => ({ loading });

const mapDispatchToProps = {
  onAddCount: setUsersData,
  onDelCount: setResourcesLoading,
  onResetCount: setResourcesError
};
export default connect(
  mapStateToProps,
  mapDispatchToProps
)(Users);

Это главный компонент

  export default connect(state => state)(({ title, linkTo, buttonText }) => {
      return (
        <Fragment>
          <Header>
            <TextStart>{title}</TextStart>
          </Header>
          <nav>
            <br />
            <Link href={linkTo}>
              <button>{buttonText}</button>
            </Link>
            <Users />
          </nav>
        </Fragment>
      );
    });
1
  • Возможно, mapDispatchToProps должна быть функцией, которая возвращает объект. 6 фев 2019 в 3:42

1 ответ 1

1

Не верно используешь mapDispatchToProps. Там должна быть callback функция:

const mapDispatchToProps = dispatch => {
  return {
    onTodoClick: id => {
      dispatch(toggleTodo(id))
    }
  }
}

Код из документации по подключению к react: https://redux.js.org/basics/usage-with-react#usage-with-react

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge you have read our privacy policy.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.