难以创建使用React Redux和axios提取数据的操作

问题描述

这个周末我去学习Redux,但是我不明白如何使用 axios Redux Redux Thunk 进行API调用。 strong>

我已从此示例项目中删除了所有内容,因此只有一个操作:我要从中获取数据。

Here's the link to my codesandbox

我确定我错过了一件非常简单的事情,但我不知道这是什么。 如果有人可以帮助我或指出正确的方向,我将不胜感激

我的减速器

const initialState = {
  data: [],};

const reducer = (state = initialState,action) => {
  const newState = { ...state };

  switch (action.type) {
    case 'SOMETHING':
      newState.data = action.data;
      console.log(newState.data);
      break;
    default:
      newState;
  }
  return newState;
};

export default reducer;

我的操作

import axios from 'axios';

export function someFunction() {
  return (dispatch) => {
    axios.get('https://api.pokemontcg.io/v1/types').then((response) => {
      dispatch({ type: 'SOMETHING',data: response.data });
    });
  };
}

我的App.js

function App({ someFunction }) {
  return (
    <div className="App">
      <button onClick={someFunction}>Click Me</button>
    </div>
  );
}

const mapStateToProps = (state) => {
  return {
    data: state.data,};
};

const mapDispatchToProps = (dispatch) => {
  return {
    something: () => dispatch(actionCreator.someFunction()),};
};
export default connect(mapStateToProps,mapDispatchToProps)(App);

解决方法

暂无找到可以解决该程序问题的有效方法,小编努力寻找整理中!

如果你已经找到好的解决方法,欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@)