web-dev-qa-db-fra.com

(React Native) Charger le fichier HTML local dans WebView

J'essaie de charger le fichier .html local dans WebView dans React Native :

// load local .html file
const PolicyHTML = require('./Policy.html');

// PolicyHTML is just a number of `1`
console.log('PolicyHTML:', PolicyHTML);

// will cause an error: JSON value '1' of type NSNumber cannot be converted to NSString
<WebView html={PolicyHTML} />

Le fichier .html doit être lu comme une chaîne et non comme un représentant des ressources. 

Comment puis-je charger le fichier .html dans WebView dans React Native?

À propos, quel est le type de ces représentants de ressources de require()? Est-ce number?

webviewreact-native
15
李岡諭

essayez le:

const PolicyHTML = require('./Policy.html');

<WebView
  source={PolicyHTML}
  style={{flex: 1}}
 />
21
Fmussap

Je tombe sur ce post à la recherche d'un chargement HTML statique.
Si votre code html est récupéré à l'aide, par exemple, d'une API, vous pouvez rendre WebView de la manière suivante:

<WebView
    originWhitelist={['*']}
    source={{ html: html, baseUrl: '' }}
/>

Notez que originWhitelistest nécessaire comme expliqué dans la documentation :

Notez que le HTML statique nécessitera la définition de originWhitelist pour exemple à ["*"].

3
Luca Davanzo
<View style={{flex: 1}}>
    <WebView
      style={{flex: 1}}
      source={require("./resources/index.html")}
    />
</View>

Pour créer WebView, le parent doit avoir une dimension ou un flex: 1. Nous pourrions définir WebView sur flex: 1 également pour qu'il remplisse le parent.

1
stevemu