Как сослаться на локальный файл xml при разработке в react?

Ссылка скопирована
JavaScript
1 ответ

Есть замечательная инструкция import. Которая очень удобно используется для ссылок на функции/значения/модули.
Я пробую через import сослаться на xml-файл (его надо будет разобрать и отработать):
import xmlData from "./../assets/description/DSS10_InitSettings.xml";
Естественно, получаю String с ссылкой на файл. Которую в парсер передавать бессмысленно.
Вопрос 1: почему картинки, например, подхватываются и выводятся (например, через img src), а xml - нет. В принципе, мозгом как-то понимаю, но объяснить не могу.
Вопрос 2: как проще сделать? Вариант XML завернуть в константу js не нравится (по ряду причин). Изящно выкрутиться можно? Сказав, что по этому пути лежит файл. Он текстовый. Спарси мне его, как XML, плз.
Конечно, можно файл через API загрузить, но для меня это нелогично (все равно, что ini-файл каждый раз при загрузке открывать). Есть возможность сделать проще?

Дополнительно:

Пользуетесь webpack?

https://codetogo.io/how-to-fetch-xml-in-javascript/

  • Конечно, можно файл через API загрузить, но для меня это нелогично

  • Вопрос 1. Понял сам. Зачем спрашивал?!
    Вопрос 2. При некотором рассмотрении, все равно дальше без API не обойтись. Не хотелось на MVP городить, если дальше не пойдет. Спасибо!
    Все вопросы закрыты.
  • illiario, в теории можете resolver написать, который будет DOMParser (или что-то другое) внутри юзать.
Нужно решить такую задачу?

Опишите проблему, и специалист поможет с настройкой, исправлением ошибки или доработкой сайта. Подберём понятный план работ без лишней переписки.

Заказать помощь
Лучший ответ
1
Артём Dev Ответ

Для того чтобы сослаться на локальный файл XML при разработке в React, вы можете использовать удобный способ импорта файла XML в ваш компонент.

Для начала, поместите ваш файл XML в папку вашего проекта, например, в папку "public" или "src". Далее, в вашем компоненте React вы можете импортировать файл XML, используя специальный синтаксис импорта.

Пример кода:

import React from 'react';
import xmlData from './path/to/your/xml/file.xml';
 
const MyComponent = () => {
  // Здесь вы можете использовать данные из вашего файла XML
  console.log(xmlData);
 
  return (
    <div>
      {/* Ваш JSX код */}
    </div>
  );
}
 
export default MyComponent;

import React from 'react'; import xmlData from './path/to/your/xml/file.xml'; const MyComponent = () =&gt; { // Здесь вы можете использовать данные из вашего файла XML console.log(xmlData); return ( <div> {/* Ваш JSX код */} </div> ); } export default MyComponent;

Пожалуйста, обратите внимание на то, что в зависимости от структуры вашего проекта, путь к файлу XML может отличаться. Поэтому убедитесь, что путь указан правильно в функции импорта.

Таким образом, вы сможете легко использовать данные из локального файла XML в вашем проекте React без необходимости отправки запросов на сервер.

Другие ответы (0)

Пока нет других ответов. Будьте первым, кто поможет автору.

Ответить на вопрос

комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *

Вам также может быть интересно

VPN Как правильно настроить vless для Android TV? 1 ответ Pyrogram Как правильно зарегистрировать юзер бота в Telegram? 1 ответ печатные-платы Как заставить запускаться программу M3.exe от компании Hanxing AOI в инспекционной машине на Windows 7 Pro? 1 ответ Аккумуляторные батареи Почему при зарядке автостарта слышен писк, где искать причину? 1 ответ