Javascript Redux在使用Redux thunk时触发未定义的操作

这个问题可能源于对redux thunk的错误配置或对如何编写thunk的误解。我已经尝试了很多不同的方法，但从我所知道的，这应该是有效的。然而，我仍然收到一条控制台消息，说它触发了一个未定义的redux操作

这是我的商店配置

import React from 'react';
import ReactDOM from 'react-dom';
import { Provider } from 'react-redux';
import { applyMiddleware, createStore } from 'redux';
import thunk from 'redux-thunk';
import App from './components/App';
import rootReducer from './reducers';

const store = createStore(rootReducer, applyMiddleware(thunk));

ReactDOM.render(
    <Provider store={ store }>
        <App />
    </Provider>,
    document.getElementById('rootElement')
);

下面是我在组件中启动的操作：

import React from 'react';
import { connect } from 'react-redux';
import { bindActionCreators } from 'redux';
import * as actions from '../../actions/about';
import getAboutContent from '../../reducers';

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

  componentWillMount() {
    this.props.getAboutContent();
  }

  render() {
    return <div>{ this.props.content }</div>
  }
}

const mapStateToProps = (state) => ({
  content: {} || getAboutContent(state)
})

const mapDispatchToProps = (dispatch) => 
  bindActionCreators({ getAboutContent }, dispatch)

export default connect(
  mapStateToProps, mapDispatchToProps
)(AboutMe);

从“React”导入React；
从'react redux'导入{connect}；
从“redux”导入{bindActionCreators}；
将*作为操作从“../../actions/about”导入；
从“../../reducers”导入getAboutContent；
类AboutMe扩展了React.Component{
建造师（道具）{
超级（道具）；
}
组件willmount（）{
this.props.getAboutContent（）；
}
render（）{
返回{this.props.content}
}
}
常量mapStateToProps=（状态）=>({
内容：{}| | getAboutContent（州）
})
const mapDispatchToProps=（调度）=>
bindActionCreators（{getAboutContent}，dispatch）
导出默认连接(
mapStateToProps，mapDispatchToProps
)（关于我）；

我已经尝试了很多mapDispatchToProps的配置，例如，

connect（…，{fetchData:getAboutContent}）.

，等等。非常感谢您的帮助

编辑：

---

这是git repo，如果这对任何人都有帮助的话：

检查你的减速机名称，你导出

fetchAboutContent

，但是导入

getAboutContent

动作文件中的代码似乎不正确

getState是一个函数

const state = getState();

更改以下代码

import axios from 'axios';

export const GET_ABOUT_CONTENT_REQUEST = 'GET_ABOUT_CONTENT_REQUEST';
export const GET_ABOUT_CONTENT_FAILED = 'GET_ABOUT_CONTENT_FAILED';
export const GET_ABOUT_CONTENT_OK = 'GET_ABOUT_CONTENT_OK';

export const fetchAboutContent = () => {
  const url = `http://localhost:3000/about`;

  return (dispatch, getState) => {
    if (getState().isInitialized === true){
      console.log("desktop init should not be called when already desktop is init")
      return Promise.resolve();
    }

    if (getState().about.isLoading) {
      console.log('is loading');
      return Promise.resolve();
    }
    dispatch({ type: GET_ABOUT_CONTENT_REQUEST });
    axios.get(url)
      .then(res => dispatch({
        type: GET_ABOUT_CONTENT_OK,
        res
      }))
      .error(err => dispatch({ 
        type: GET_ABOUT_CONTENT_FAILED,
        err
      }));
  }
}

您还需要从axios调用返回承诺，只需添加返回语句

return axios.get(url)
  .then(res => dispatch({
    type: GET_ABOUT_CONTENT_OK,
    res
  }))
  .error(err => dispatch({ 
    type: GET_ABOUT_CONTENT_FAILED,
    err
  }));

---

结果是我在进口时丢失了很多东西。它的命名不正确，我也调用了选择器，好像它是一个动作创建者一样，因为我的导入命名错误。这肯定是错误的，但是我认为这个错误发生在这之前。当我不正确地调用getstate时，它实际上给了我一条有用的console.error消息，但我确实需要解决这个问题。非常感谢。

return axios.get(url)
  .then(res => dispatch({
    type: GET_ABOUT_CONTENT_OK,
    res
  }))
  .error(err => dispatch({ 
    type: GET_ABOUT_CONTENT_FAILED,
    err
  }));