Как отправить действие в следующем. js getStatisProps - PullRequest
0 голосов
/ 08 июля 2020

Я новичок в следующем 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;
    } 

}

проблема в том, что: -

  1. Запрос API не выполняется.
  2. Когда я наводил курсор на оператор await на странице компонентов, он говорит: await has no effect on type of this expression

Есть предложения?

1 Ответ

1 голос
/ 08 июля 2020

GetStaticProps работает только на стороне сервера, поэтому ваш redux logi c не будет работать. Вы можете отправить данные при инициализации хранилища redux на странице _app, используя next-redux-wrapper

...