使用redux-thunk发送axios

安装redux-thunk
https://www.npmjs.com/package/redux-thunk

npm install --save redux-thunk

页面配置

import { createStore,applyMiddleware,compose } from 'redux';
import reducer from './reducer';
import thunk from 'redux-thunk';
const composeEnhancers =
  window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ ?   
  window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__({}) : compose;

const enhancer = composeEnhancers(
  applyMiddleware(thunk),
);
const store = createStore(reducer, enhancer)

UI 组件页面调用

//生命周期发起axios
componentDidMount(){
  const action=getTodoList()
  store.dispatch(action)
}

js编写

export const getTodoList=()=>{
  return (dispatch)=>{
    let htm="https://api.mlwei.com/music/api/?key=523077333&cache=1&type=so&id=%E6%B5%81%E8%A1%8C&size=hq"
        axios.get(htm).then((res)=>{
            const data=res.data.Body
            const action=initListAction(data)
            dispatch(action)
            console.log(data)
        })
  }
}