React Native Version:0.51
RN 在 0.37 版本中加入了WebView功能，所以想要在使用WebView,版本必須>=0.37，發送的 message 只能是字符串，所以需要將其他格式的數據轉換成字符串，在接收到后再轉換回去，其實直接用JSON.stringify和JSON.parse就可以
加載 html
source屬性用于指定加載的 html，可以加載在線的頁面，也可以加載本地的頁面，代碼如下：
// 加載線上頁面
source={{uri: 'http://www.mi.com'}}
/>
// 加載本地html文件
source={require('../src/html/index.html')}
/>
注意 ??
在 RN 中可以加載 WebView，但是無法調試，也不能使用 alert 來驗證代碼 js 代碼是否運行成功，只能通過往 html 寫入東西(innerHTML)來驗證 js 是否運行成功
WebView 與 html 的通信
webview 發送信息到 html
WebView 給 html 發送信息需要使用postMessage，而 html 接收 RN 發過來的信息需要監聽message事件，代碼如下：
// RN
class WebViewExample extends Component {
onLoadEnd = () => {
this.refs.webview.postMessage = 'this is RN msg'
}
render() {
return (
ref="webview"
source={require('../html/index.html')}
onLoadEnd={this.onLoadEnd}
/>
)
}
}
export default WebViewExample
// web
window.document.addEventListener('message', function(e) {
const message = e.data
})
這里需要注意一點
postMessage需要在 webview 加載完成之后再去 post，如果放在commponentWillMount里由于頁面沒有加載完成就 post 信息，會導致 html 端無法監聽到 message 事件。
html 發送信息到 webview
// RN
class WebViewExample extends Component {
handleMessage = e => {
const message = e.nativeEvent.data
}
render() {
return (
ref="webview"
source={require('../html/index.html')}
onMessage={e => this.handleMessage(e)}
/>
)
}
}
export default WebViewExample
// web
window.postMessage('this is html msg')
debug
RN 中 debug webview 和安卓開發中看起來是差不多的，連接好設備后，在 chrome 中輸入
chrome://inspect
就可以看到安卓設備上正在運行的 webview 了，點擊inspect就會開啟一個調試頁面，就可以進行 debug 了，RN 似乎默認開啟了 debug 調試，直接就可以看到 webview 中輸出的信息。
webview_debug.png
但是我發現我打開的調試界面是一個錯亂的界面，不知道為什么，無奈。
debug界面.jpeg
注意 ??
這里需要注意一點的，由于安卓版本的差異，所以內部的 webview 對 js 的支持程度也不同，為了保證兼容性，如果使用了 ES6，請轉成 ES5，否則會報錯。
...)
？)
