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 ?
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.
Plus de références proviennent de : WebView Html chargé depuis local