代码之家  ›  专栏  ›  技术社区  ›  tcoulson

设置redux thunk时出错

  •  0
  • tcoulson  · 技术社区  · 8 年前

    我有以下动作创建者:

    export function selectBook(ISBN, dispatch) {
        const url = `${ROOT_ITEMS_URL}/${ISBN}?all=true`;
        dispatch({ type: 'SELECT_BOOK_LOADING', isLoading:true });
        axios.get(url)
            .then(({ data }) => dispatch({ type: 'SELECT_BOOK_SUCCESS', data}))
            .catch(( err ) => dispatch({ type: 'SELECT_BOOK_FAILURE', isLoading:false}))
    }
    

    我的项目主索引文件中还包含以下内容:

    import React from 'react';
    import ReactDOM from 'react-dom';
    import { Provider } from 'react-redux';
    import { createStore, applyMiddleware } from 'redux';
    
    import LoginLayout from './layouts/LoginLayout';
    
    import reducers from './reducers';
    import ReduxPromise from 'redux-promise';
    import reduxThunk from 'redux-thunk';
    
    const createStoreWithMiddleware = applyMiddleware(ReduxPromise, reduxThunk)(createStore);
    //const createStoreWithMiddleware = applyMiddleware()(createStore);
    
    ReactDOM.render(
        <Provider store={createStoreWithMiddleware(reducers)}>
            <LoginLayout />
        </Provider>
        , document.querySelector('.root'));
    

    我对如何在我的项目中调用调度感到困惑。我收到以下错误:

    捆js:5690未捕获类型错误:调度不是函数

    调用此函数时,我没有传递任何调度。但我不知道如何调用调度。这是我需要用函数调用进行的redux调用吗?

    this.props.selectBook(params.bookID);
    

    应该是这个吗?:

    this.props.selectBook(params.bookID, dispatch);
    

    发货时使用什么导入?是否从“redux”导入调度?

    2 回复  |  直到 8 年前
        1
  •  1
  •   Rich Churcher    8 年前

    dispatch 通过以下途径免费提供给您 redux-thunk 。这里的诀窍是动作创建者应该返回 作用 ,函数的第一个参数为 派遣 。您的动作创建者最终将看起来像这样:

    export function selectBook(ISBN) {
      return dispatch => {
        const url = `${ROOT_ITEMS_URL}/${ISBN}?all=true`;
        dispatch({ type: 'SELECT_BOOK_LOADING', isLoading:true });
        axios.get(url)
          .then(({ data }) => dispatch({ type: 'SELECT_BOOK_SUCCESS', data}))
          .catch(( err ) => dispatch({ type: 'SELECT_BOOK_FAILURE', isLoading:false}))
      }
    }
    
        2
  •  1
  •   proti    8 年前

    尝试这样做动作创建者: export function selectBook(ISBN) { const url = `${ROOT_ITEMS_URL}/${ISBN}?all=true`; return dispatch => { dispatch({ type: 'SELECT_BOOK_LOADING', isLoading:true }); axios.get(url) .then(({ data }) => dispatch({ type: 'SELECT_BOOK_SUCCESS', data})) .catch(( err ) => dispatch({ type: 'SELECT_BOOK_FAILURE', isLoading:false})) } } 需要返回函数