API调用

Question

那是我的 store.js ：

import { createStore, applyMiddleware } from 'redux';
import thunkMiddleware from 'redux-thunk';
import { createLogger } from 'redux-logger';
import mainReducer from './reducers/index';
import fetchJokes from './actions/jokes';
const loggerMiddleware = createLogger();

const store = createStore(
  mainReducer,
  applyMiddleware(
    thunkMiddleware,
    loggerMiddleware
  )
)
store
  .dispatch(fetchJokes(1))
  .then(() => console.log(store.getState()))

export default store

那是我的 /actions/jokes.js

import fetch from 'cross-fetch';
import { REQUEST_JOKES, RECEIVE_JOKES } from '../types/jokes'

/*synchronous actions*/

export const requestJokes = quantity => ({
  type: REQUEST_JOKES,
  quantity
});

export const receiveJokes = data => ({
  type: RECEIVE_JOKES,
  jokes: data.value.map(j => j.joke)
});

/*asynchronous actions*/

export const fetchJokes = quantity => {
  return dispatch => {
  dispatch(requestJokes(quantity))
    return fetch('https://api.icndb.com/jokes/random/${quantity}')
      .then(response => response.json(),
        error => console.log('An error: ', error))
      .then(data => dispatch(receiveJokes(data)))
  }
} 

控制台给我带来了一个错误Uncaught TypeError: (0 , _jokes2.default) is not a function。我已经用动作fetchJokes调查了这个问题但是这个函数的实际问题是什么我不能识别。

Answer 1

您正在使用fetchJokes的命名导出，因此您应该像这样导入

import { fetchJokes } from './actions/jokes';