Untitled
unknown
jsx
2 years ago
1.0 kB
9
Indexable
import { createStore, applyMiddleware } from 'redux';
import thunk from 'redux-thunk';
const initialState = {
loading: false,
data: null,
error: null,
};
function reducer(state = initialState, action) {
switch (action.type) {
case 'FETCH_DATA_REQUEST':
return { ...state, loading: true };
case 'FETCH_DATA_SUCCESS':
return { ...state, loading: false, data: action.payload };
case 'FETCH_DATA_FAILURE':
return { ...state, loading: false, error: action.payload };
default:
return state;
}
}
const store = createStore(reducer, applyMiddleware(thunk));
function fetchData() {
return async (dispatch) => {
dispatch({ type: 'FETCH_DATA_REQUEST' });
try {
const response = await fetch('/my-api/data');
const data = await response.json();
dispatch({ type: 'FETCH_DATA_SUCCESS', payload: data });
} catch (error) {
dispatch({ type: 'FETCH_DATA_FAILURE', payload: error });
}
};
}
store.dispatch(fetchData());
Editor is loading...