Redux: импорт создателя действия в другую вызывает typeError 'x is not function' - PullRequest
0 голосов
/ 04 сентября 2018

Я сталкиваюсь с ошибкой типа, которая действительно смущает меня и сводит меня с ума:

У меня есть создатель автомобильного действия:

import * as dispatchTypes from '../helper/dispatchTypes';
import { notifyBuyer } from  './buyer';

export const addCar = () => async dispatch => {
  const response = await fetch(someUrl, someBody)

  if (response.ok) {
    const car = await response.json();
    dispatch({type: dispatchTypes.ADD_CAR_RESPONSE, car});
    return notifyBuyer()(dispatch);
  };
}

У меня есть создатель действия для notifyBuyer () в рамках сайта customer.js:

...
export const notifyBuyer = () => async dispatch => {
...

Наконец, я также вызываю notifyBuyer () внутри компонента React:

import * as actions from '../../actions/buyer';

class WhateverComponent extends React.Component {
  constructor(props) {
    super(props);
  }

  doSomething = event => {
    if (!event.disabled) {
      this.props.notifyBuyer(event.toString());
    }
  };

  render() {...}

}

export const StyledComponent = withStyles(styles)(WhateverComponent);
export default connect(
  state => ({}),
  {notifyBuyer: actions.notifyBuyer}
)(StyledComponent);

Если я запускаю приложение и запускаю функцию doSomething, я получаю следующее error :

TypeError: _this.props.notifyBuyer is not a function

Интересная вещь: Если я удаляю "import {notifyBuyer} из './buyer';" из car.js, все в порядке. Но как только импорт настроен в файле, реквизиты Whither-Component больше не содержат функцию notifyBuyer (), и выдается typeError.

1 Ответ

0 голосов
/ 04 сентября 2018

Я думаю, что экспорт, используемый в функции соединения, выглядит неправильно. Используйте приведенный ниже пример кода и проверьте его.

export default connect(
  state => ({}),
  dispatch => ({notifyBuyer: dispatch(actions.notifyBuyer)})
)(StyledComponent); 
...