当您在使用redux时,axios.get不工作可能有以下几个可能的原因:
import { createStore, applyMiddleware } from 'redux';
import thunk from 'redux-thunk';
import rootReducer from './reducers';
const store = createStore(rootReducer, applyMiddleware(thunk));
import axios from 'axios';
export const fetchData = () => {
return (dispatch) => {
dispatch({ type: 'FETCH_DATA_REQUEST' });
axios.get('https://api.example.com/data')
.then(response => {
dispatch({ type: 'FETCH_DATA_SUCCESS', payload: response.data });
})
.catch(error => {
dispatch({ type: 'FETCH_DATA_FAILURE', payload: error.message });
});
};
};
在上述代码中,fetchData是一个异步的action creator,它使用axios进行网络请求,并在请求成功或失败后分别派发相应的同步action。
import React, { useEffect } from 'react';
import { connect } from 'react-redux';
import { fetchData } from './actions';
const MyComponent = ({ data, fetchData }) => {
useEffect(() => {
fetchData();
}, []);
return (
<div>
{/* 使用data进行渲染 */}
</div>
);
};
const mapStateToProps = (state) => {
return {
data: state.data,
};
};
export default connect(mapStateToProps, { fetchData })(MyComponent);
在上述代码中,使用connect函数将MyComponent组件连接到redux store,并将fetchData action creator映射到组件的props中。在组件的useEffect钩子中,调用fetchData来触发异步操作。
请注意,以上答案中没有提及腾讯云相关产品和产品介绍链接地址,因为要求答案中不能提及亚马逊AWS、Azure、阿里云、华为云、天翼云、GoDaddy、Namecheap、Google等流行的一些云计算品牌商。
领取专属 10元无门槛券
手把手带您无忧上云