こんにちは、皆さん、私はプロジェクトを終了し、Netlifyにアップロードしました。ページをリロードするとこの問題が発生し、エラー404が発生します。エンドポイントがデータを取得していないため、コンソールに未定義が表示されたと思われます。この問題の謎を解くために、コードを解決またはリファクタリングするにはどうすればよいですか?
これが私のuseContextです:
import React, { createContext, useState, useEffect } from 'react';
export const ModelsContext = createContext();
const ModelsProvider = (props) => {
//State de modelos
const [ modelo, guardarModelo ] = useState([]);
const [ modelos, guardarModelos ] = useState([]);
const [ allModelos, guardarAllModelo ] = useState([]);
const { id } = modelo;
console.log(id);
//Cargar un modelo
useEffect(() => {
const consultarAPI = async () => {
try {
const api = await fetch("https://challenge.agenciaego.tech/models");
const modelos = await api.json();
const api2 = await fetch(`https://challenge.agenciaego.tech/models/${id ? id : ""}`);
const modelo = await api2.json();
guardarAllModelo(modelos);
guardarModelos(modelos);
guardarModelo(modelo);
} catch (error) {
console.log(error);
}
}
consultarAPI()
}, [id]);
return (
<ModelsContext.Provider
value={{
allModelos,
modelo,
modelos,
guardarModelo,
guardarModelos
}}
>
{props.children}
</ModelsContext.Provider>
)
}
export default ModelsProvider;
次に、リポジトリ全体へのリンクがあります:https://github.com/patricio1984/desafio-ego
そして最後にデプロイリンク:https://musing-hermann-5129b4.netlify.app/models
よろしくお願いします!
これはNetlifyの問題であり、アプリではありません。すべてのパスに対してindex.htmlを返すようにNetlifyに指示する必要があります。
https://docs.netlify.com/routing/redirects/
と呼ばれるプロジェクトのルートに新しいファイルを作成しnetlify.toml
、以下を追加します
netlify.toml
[[redirects]]
from = "/*"
to = "/index.html"
status = 200
この記事はインターネットから収集されたものであり、転載の際にはソースを示してください。
侵害の場合は、連絡してください[email protected]
コメントを追加