Я новичок в следующем Js. Я хочу, чтобы мой компонент загружался после разрешения вызова API, и я хочу сохранить ответ этого вызова API в хранилище redux.
вот мой компонент: -
const BlogPage = () => {
return(
<p>Blogs>
)
}
export const getStaticProps = async () => {
const dispatch = useDispatch()
const nuggetList = await dispatch(getNuggetsList())
return {
props: {
nuggetList
}
}
}
Action. js: -
import axios from "axios";
export const GET_NUGGET_LIST = 'GET_NUGGET_LIST'
export const getNuggetsList = () => {
return(
async (dispatch) => {
const res = await axios.get('/blog/nuggets').catch(error => {throw error})
dispatch({type: GET_NUGGET_LIST, payload: res.data})
return(res);
}
);
}
Редуктор. js: -
import { GET_NUGGET_LIST } from "./action";
const initialState = []
export const NuggetList = (state = initialState, action) => {
switch(action.type){
case GET_NUGGET_LIST:
return{...state, nuggetList: action.payload}
default:
return state;
}
}
проблема в том, что: -
- Запрос API не выполняется.
- Когда я наводил курсор на оператор
await
на странице компонентов, он говорит: await has no effect on type of this expression
Есть предложения?