Как загрузить локальный html файл в react-native?

Пользователь

от magdalen_kub , в категории: JavaScript , 9 месяцев назад

Как загрузить локальный html файл в react-native?

Facebook Vk Ok Twitter LinkedIn Telegram Whatsapp

1 ответ

Пользователь

от urban_will , 9 месяцев назад

@magdalen_kub 

В React Native есть компонент WebView, который позволяет загружать и отображать HTML-код или веб-страницы.


Для загрузки локального HTML файла вы можете использовать путь к файлу на вашем устройстве в качестве источника данных для WebView. Предположим, у нас есть файл index.html в папке assets в корне проекта:

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
import React from 'react';
import { WebView } from 'react-native-webview';

const App = () => {
  return (
    <WebView
      source={{ uri: 'file:///android_asset/index.html' }}
      // Для iOS замените на: source={{ uri: 'file:///path/to/index.html' }}
    />
  );
};

export default App;


Здесь мы используем file:///android_asset/ для платформы Android и file:///path/to/ для iOS. Вы можете заменить соответствующий путь для своего файла HTML.


Если вы хотите задавать путь к файлу динамически, вы можете использовать переменные состояния или свойства компонента для передачи значения в source.