Utilisez CSS et JS locaux pour charger du HTML local dans React Native Webview
P粉642436282
P粉642436282 2024-03-26 20:25:57
0
1
407

Je souhaite charger des fichiers html, css, js locaux dans mon React Native WebView mais je ne parviens pas à charger les CSS appliqués au HTML, voir la structure de mes dossiers

Ci-dessus se trouve mon code HTML avec des images CSS et des fichiers js, j'ai tout mis dans la structure de mes dossiers d'application comme ci-dessous

src --> html --> démo --> Collez tous les fichiers ci-dessus dans l'image ci-dessous

Maintenant, j'utilise ce code HTML dans l'écran réel, comme indiqué ci-dessous

let demoHtmlData = require('../../../html/demo/demo.html')
<WebView
  style={{flex: 1}}
  source={demoHtmlData}
/>

Lorsque j'exécute le code ci-dessus, le HTML est chargé mais le CSS n'est pas appliqué avec les couleurs, les styles, etc.

<head>

<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=0">
<title>VIVJOA®</title>
<meta name="apple-mobile-web-app-status-bar-style" content="#7D5895">
<meta name="theme-color" content="#7D5895" />
<link href="css/style.css" rel="stylesheet">
</head>

Dans le code ci-dessus, css/style.css n'est pas appliqué à ma vue Web, alors avez-vous une idée sur la façon de résoudre ce problème ?

P粉642436282
P粉642436282

répondre à tous(1)
P粉329425839

Vous devez placer vos fichiers html et css dans le dossier android_asset du dossier Android, et pour le dossier ios, placez-les dans les ressources du dossier ios.

if(isAndroid){
  return (
      
  )
}else{
  return(
    
  );
}

Plus de références proviennent de : WebView Html chargé depuis local

Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal