Блог

Главная - Вопросы по программированию - Моя выборка не позволяет извлечь файл JSON, который находится в том же каталоге, что и он

Моя выборка не позволяет извлечь файл JSON, который находится в том же каталоге, что и он

#reactjs #json #fetch

Вопрос:

Я пытаюсь вставить файл JSON в свой код. Он находится в том же каталоге, что и файл, в который я пытаюсь его вставить, поэтому, судя по тому, что я вижу, путь к файлу не является проблемой. Это ошибка, которую я получаю…

VM45:1 Неперехваченная (в обещании) синтаксическая ошибка: Неожиданный токен

 import React from 'react';

export default function Coding() {
    const [Coding, setCoding] = React.useState([]);

    React.useEffect(() => {
        fetch('./Objects.json')
            .then((result) => {
                console.log(result.json())
                return result.json();
            })
            .then((pop) => {
                console.log('Coding')
                setCoding(pop);
                console.log(Coding)
            })
            .catch((err) => {
                console.log(err);
            });

    }, [])


    return (
        <div>

        </div>
    )
}

Вот JSON:

 [
    {
        "ID": 1,
        "title": "Example",
        "content": "lorem ipsumssssssssssssssssss"
    },
    {
        "ID": 2,
        "title": "Example",
        "content": "lorem ipsumssssssssssssssssss"
    },
    {
        "ID": 3,
        "title": "Example",
        "content": "lorem ipsumssssssssssssssssss"
    },
    {
        "ID": 4,
        "title": "Example",
        "content": "lorem ipsumssssssssssssssssss"
    },
    {
        "ID": 5,
        "title": "Example",
        "content": "lorem ipsumssssssssssssssssss"
    }
]

Комментарии:

1. Что возвращается вместо этого? Вы уверены, что файл подается по указанному URL-адресу? (Проверьте вкладку «Сеть».)

2. Также имейте в виду, что относительные URL-адреса могут не дать вам желаемого результата, если вы используете маршрутизацию на стороне клиента… Например, ./Object.json данные, извлеченные с веб — сайта https://example.com/some/route/here , будут отправлены по https://example.com/some/route/Object.json адресу-здесь было бы более целесообразно указать корневые URL-адреса.

3. Файл JSON хранится локально, он находится в той же папке. Не размещено в Интернете.

4. Тогда как вы ожидаете, что он будет загружен с веб fetch -сайта во время выполнения? Может быть, вы хотите включить его во время компиляции?

Ответ №1:

Если это локальный файл JSON, его не нужно извлекать. Вы можете просто require это:

 const objects = require('./Objects.json');
React.useEffect(() => {
     console.log('Coding')
     setCoding(objects);
     console.log(Coding)
}, [])

Комментарии:

1. Проблема с этим заключается в том, что он не регистрирует код таким образом, чтобы я мог извлечь информацию JSON. Моя цель состоит в том, чтобы преобразовать объекты JSON в обычные объекты

2. Я также планирую, что в конечном итоге это будет вызов базы данных, как только я изучу базы данных. Большое вам спасибо за вашу помощь.

Метки: , ,