NextJS Dynamické Vykreslování

Question 1

Dlouhou dobu vývojka konečně vyzvednout Next.js, takže vím, že je to pravděpodobně redukuje na něco hloupého. Zde jde. Co je špatného na mém getStaticPaths() hodnota tady? Vypadá to, že jsem formátován to přesně tak, jak dokumenty vyžadují. (Hodnota přiřazená paths je console.log()'d v okně terminálu)

export const getStaticPaths = async () => {
    const paths = getEvents();
    return {
        paths,
        fallback: false
    };
};

A getEvents() funkce:

export const getEvents = () => {
    axios.post(`${globals.api_endpoint}getEvents.php`, {
        action: 'getStaticPaths'
    }).then((r) => {
        if (!r.data.error) {
            const paths = r.data.map(index => {
                return {
                    params: {
                        id: index.event_id
                    }
                };
            });
            console.log(paths);
            return paths;
        }
    });
};

Question 2

Na getStaticPath je async funkci. Pokud děláte něco takového paths vždy bude Slib.

const paths = getEvents();
return {
    paths,
    fallback: false
};

Byste měli použít čekají klíčové slovo tady, čekat na výsledky:

const paths = await getEvents();

a v getEvents funkci, kterou by měl vrátit všechny axios.po hovoru, tak jako:

return axios.post(`${globals.api_endpoint}getEvents.php`, {...

Navíc, nevím, jak vaše api endpoint vypadá, ale api cesta by měla vypadat takto: ${globals.api_endpoint}/getEvents.php. Váš api endpoint neměl lomítkem na konci.

Question 3

Nádherné. Díky, @krybinski za pomoc. Z kurzu vrací slib. Chybu nebylo tak hloupé, jak jsem čekal, ale něco jednoduchého, pro jistotu.

export const getEvents = async () => {
    return axios.post(`${globals.api_endpoint}getEvents.php`, {
        action: 'getStaticPaths'
    });
};


export const getStaticPaths = async () => {
    const response = await getEvents();
    const paths = response.data.map(event => {
        return {
            params: {
                id: event.event_id
            }
        }
    });
    return {
        paths,
        fallback: false
    };
};

krybinski · Answer 1 · 2021-11-23T05:57:30

Na getStaticPath je async funkci. Pokud děláte něco takového paths vždy bude Slib.

const paths = getEvents();
return {
    paths,
    fallback: false
};

Byste měli použít čekají klíčové slovo tady, čekat na výsledky:

const paths = await getEvents();

a v getEvents funkci, kterou by měl vrátit všechny axios.po hovoru, tak jako:

return axios.post(`${globals.api_endpoint}getEvents.php`, {...

Navíc, nevím, jak vaše api endpoint vypadá, ale api cesta by měla vypadat takto: ${globals.api_endpoint}/getEvents.php. Váš api endpoint neměl lomítkem na konci.

FrontEndDev · Answer 2 · 2021-11-23T13:53:11

Nádherné. Díky, @krybinski za pomoc. Z kurzu vrací slib. Chybu nebylo tak hloupé, jak jsem čekal, ale něco jednoduchého, pro jistotu.

export const getEvents = async () => {
    return axios.post(`${globals.api_endpoint}getEvents.php`, {
        action: 'getStaticPaths'
    });
};


export const getStaticPaths = async () => {
    const response = await getEvents();
    const paths = response.data.map(event => {
        return {
            params: {
                id: event.event_id
            }
        }
    });
    return {
        paths,
        fallback: false
    };
};

NextJS Dynamické Vykreslování

Otázka

Nejlepší odpověď

V jiných jazycích

Tato stránka je v jiných jazycích

Populární v této kategorii

Oblíbené položky v této kategorii