React Native WebView使用本地HTML文件

React Native WebView使用本地HTML文件

这里注意本地的文件路径为：http://localhost:8081/iosPages/b.html

 

HTML文件 /iosPages/b.html： 

<h1>this is a html file</h1>
<p>this is content hello </p>

 

JS文件：

'use strict';
var React = require('react-native');
var {
  StyleSheet,
  Text,
  View,
  WebView,
} = React;

var App = React.createClass({
  getInitialState: function () {
    return ({
        content: '',
    });
  },
  render: function() {
    return (
      <View style={{flex:1, marginTop:60}}>
        <WebView html={this.state.content} automaticallyAdjustContentInsets={false} />
      </View>
    );
  },
  componentDidMount: function () {
    let url = 'http://localhost:8081/iosPages/b.html';
    fetch(url)
      .then((response) => response.text())
      .then((responseText) => {
        this.setState( {content: responseText});
      })
      .catch((error) => {
        console.warn(error);
      });
  },

});

module.exports = App;