Работа с connect Redux, прокидование props

152
19 сентября 2019, 15:00

Пытаюсь подключить через конект свой функциональный компонент. Использую 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>
      );
    });
Answer 1

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

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

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

READ ALSO
Разный результат шифрования

Разный результат шифрования

Шифрую строку в java и javascriptИспользую одинаковые настройки, ключ, вектор, метод и т

126
Как указать тип для массива, который состоит из строк являющихся свойствами объекта?

Как указать тип для массива, который состоит из строк являющихся свойствами объекта?

Подскажите, пожалуйста, можно ли как то в TypeScript указать тип для массива, таким образом, что бы описать, что он может состоять только из тех...

150
Canvas | Javascript игра

Canvas | Javascript игра

Управляешь самолетом и собираешь топлива, каждая собранная соплива увеличивает счетчик топлива до 10(единица топлива дает 1сек полета)Нужно...

136
Настройка HTML формы Яндекс Кассы. Копирование элементов формы в ключ JSON

Настройка HTML формы Яндекс Кассы. Копирование элементов формы в ключ JSON

Копирование данных из нескольких полей формы в значения ключа JSON

142