私が取り組んでいる反応するネイティブアプリケーションのために、Viewコンポーネント内でWebViewコンポーネントを使用しようとしています。 WebViewをViewに埋め込むと、WebViewに表示しているコンテンツが表示されません。これは反応ネイティブの期待された動作ですか?ビュー内でWebViewを使用できますか(ネイティブ対応)?
10
A
答えて
15
ウェブビューの幅と高さを指定する必要があります。 次のようにそれを実行します。
render() {
return (
<WebView
source={{uri: 'https://github.com/facebook/react-native'}}
style={{flex: 1}} // OR style={{height: 100, width: 100}}
/>
);}
+1
これは正しい答えとして受け入れられるべきです –
+1
親 'View'も' flex:1'でなければなりません:https://snack.expo.io/r1II-3jc- –
0
それはビューコンポーネント内にネストされています場合は、この
render() {
let {url} = this.props.webDetail;
return (
<View style={styles.container}>
{this.renderSpinner()}
<WebView onLoad={this.onWebLoad.bind(this)}
source={{ uri: url }}
scalesPageToFit={true}
/>
</View>
);
}
3
のようなものを使用することができ、あなたがビューとのWebViewフレックスの両方を設定する必要があります。1.
に例えば。 -
<View style={{flex:1}}>
<WebView
source={{ uri: url }}
style={{flex:1}}
/>
</View>
関連する問題
- 1. ネイティブWindows UWPに対応 - モーダルコンポーネントを使用できますか?
- 2. ネイティブWebView URLに対応する
- 3. d3とwebViewでネイティブに反応する
- 4. ネイティブiOSネイティブモジュールに未対応ですか?
- 5. ネイティブWebViewハンドリングアンドロイドハードウェアボタンに反応します
- 6. ネイティブWebViewエラー "_onLoadingStart"に反応します
- 7. ReactネイティブでWebView内のTwitterウィジェット内の
- 8. ネイティブプッシュではなくネイティブプッシュに対応ネイティブiOSビュー
- 9. ReactネイティブWebviewでのカスタムフォントの使用
- 10. 反応するネイティブwebviewでGoogleマップを開くことができません
- 11. サンプルネイティブで反応したネイティブのサンプルアプリケーションでNビューを使用する
- 12. Androidビュー内でクラスメソッドを使用できますか?
- 13. Javascriptアラートがアンドロイドで反応しない反応ネイティブwebview
- 14. 反応しないネイティブhtml postMessageはWebViewに届きません
- 15. ReactネイティブとエキスポでWebViewのローカルファイルからCSSを使用
- 16. アンドロイドでwebViewを使用するベストプラクティスは何ですか? recyclerviewの各行でwebviewを使用できますか?
- 17. injectJavaScriptは反応ネイティブのWebviewで動作していません
- 18. Turbolinksは反応ネイティブのwebviewで動作しません
- 19. どうすればネイティブの反応にgoogleapisを使用できますか?
- 20. ネイティブのUIビューで、reactnativeを子ビューとして使用しますか?
- 21. ツールバーのアイコンを使用すると、対応ネイティブ
- 22. 反応ネイティブのナビゲータを使用して同じルートをレンダリングできますか?
- 23. WebViewを使用すべきですか?
- 24. 子ビューは反応したネイティブで親ビューから移動します
- 25. 反応ネイティブWebviewでfile://要求を許可する
- 26. <webview>の反応成分内での使用方法
- 27. ネイティブiPadアプリ内でQTVRファイルを使用することはできますか?
- 28. ネイティブAndroid GeoLocationに対応します
- 29. Windowsネイティブ対応のネイティブアプリケーションでカメラ機能を使用する方法
- 30. Webviewをフラグメント内で使用する
通常、WebViewが表示されます。 ViewとWebViewの両方でflexを1に設定するか、明示的なサイズを設定してみてください。 – Nico
サンプルコードをrnplay.orgに置くことができますか? – stereodenis
それは動作するはずです。すべての親ビューとWebviewをフレックスに設定してください:1 – abeikverdi