RN中webview的一些思考

遇到的坑：webview和h5通訊時，會有一些延遲致使不能當即生效
具體描述：在使用react-native時，須要加載外部網頁，加載後，RN提供一個按鈕能夠關閉網頁，但若是打開的是內部網頁就須要隱藏這個按鈕，h5代碼使用react寫的，在componentDidMount時，發送postmessage給客戶端（RN），此時發現收不到，查閱react-native官方文檔後得已解決。
解決過程：
https://github.com/facebook/r...，解釋了爲何要延遲
https://github.com/react-nati... 解釋了，升級後的webview爲何postmessage不能直接用

import React from 'react';
import { WebView } from 'react-native';

export default class myComponent extends React.Component<any, any> {
    public hide(){
        // 隱藏按鈕的邏輯
        // 創建一個白名單，在白名單裏的域名隱藏按鈕，以外的不作處理
    }
    public render(): React.ReactNode {
        const { navigation } = this.props;

        const { state } = navigation;

        const { params } = state;

        return <WebView
            ref={'webview'}
            source={{ uri: params.url }}
            onLoadEnd={this.hide}
        />;
    }
}

感受對你有幫助的話，支持一下哈：