@aaxis/react-native-webview 中文文档教程
React Native WebView - a Modern, Cross-Platform WebView for React Native
来自 https://github.com/react-native-webview/react-native-webview 和版本 10.3.3 的分支,以及修复重定向 URL 丢失自定义标头时的 Android 问题 更多细节请参考 RNCWebViewManager.java
React Native WebView 是一个现代的、支持良好的、跨平台的 React Native WebView。 它旨在替代内置 WebView(它将从核心中删除).
Core Maintainers - Sponsoring companies
这个项目由这些人利用他们的空闲时间和公司工作时间免费维护。
- Thibault Malbranche (Twitter @titozzz) from Brigad
- Jamon Holmgren (Twitter @jamonholmgren) from Infinite Red
Platforms Supported
- [x] iOS
- [x] Android
- [x] macOS
- [x] Windows
注意:Expo 对 React Native WebView 的支持始于 Expo SDK v33.0.0。
Getting Started
阅读我们的入门指南。 如果任何步骤看起来不清楚,请创建一个详细的问题。
Versioning
该项目遵循语义版本控制。 我们会毫不犹豫地发布重大更改,但它们将是一个主要版本。
打破历史:
当前版本:
8.0.0 - onNavigationStateChange 现在触发哈希 url 更改
7.0.1 - 删除了 UIWebView
6.0.2 - 更新至 AndroidX。 确保在项目的
android/gradle.properties
中启用它。 请参阅入门指南。5.0.1 - 重构用于从 webview 到本机通信的旧 postMessage 实现。
4.0.0 - 添加缓存(默认启用)。
3.0.0 - WKWebview:添加共享进程池所以cookies和 localStorage 在 iOS 中跨 webview 共享(默认启用)。
2.0.0 - 第一个版本是核心 webview 组件
即将推出:
- this.webView.postMessage() removal (never documented and less flexible than injectJavascript) -> how to migrate
- Kotlin rewrite
- Maybe Swift rewrite
Usage
从 react-native-webview
导入 WebView
组件并像这样使用它:
import React, { Component } from 'react';
import { StyleSheet, Text, View } from 'react-native';
import { WebView } from 'react-native-webview';
// ...
class MyWebComponent extends Component {
render() {
return <WebView source={{ uri: 'https://reactnative.dev/' }} />;
}
}
有关更多信息,请阅读 API 参考 和指南。 如果您有兴趣参与贡献,请查看贡献指南。
Common issues
- If you're getting
Invariant Violation: Native component for "RNCWebView does not exist"
it likely means you forgot to runreact-native link
or there was some error with the linking process
Contributing
请参阅 Contributing.md
Contributors
感谢这些优秀的人(表情符号键):
该项目遵循all-contributors 规范。 欢迎任何形式的贡献!
License
MIT
Translations
该自述文件可在以下位置找到:
React Native WebView - a Modern, Cross-Platform WebView for React Native
Fork from https://github.com/react-native-webview/react-native-webview and version 10.3.3, and fix an Android issue when redirect URL lost custom header More details please refer to RNCWebViewManager.java
React Native WebView is a modern, well-supported, and cross-platform WebView for React Native. It is intended to be a replacement for the built-in WebView (which will be removed from core).
Core Maintainers - Sponsoring companies
This project is maintained for free by these people using both their free time and their company work time.
- Thibault Malbranche (Twitter @titozzz) from Brigad
- Jamon Holmgren (Twitter @jamonholmgren) from Infinite Red
Platforms Supported
- [x] iOS
- [x] Android
- [x] macOS
- [x] Windows
Note: Expo support for React Native WebView started with Expo SDK v33.0.0.
Getting Started
Read our Getting Started Guide. If any step seems unclear, please create a detailed issue.
Versioning
This project follows semantic versioning. We do not hesitate to release breaking changes but they will be in a major version.
Breaking History:
Current Version:
8.0.0 - onNavigationStateChange now triggers with hash url changes
7.0.1 - Removed UIWebView
6.0.2 - Update to AndroidX. Make sure to enable it in your project's
android/gradle.properties
. See Getting Started Guide.5.0.1 - Refactored the old postMessage implementation for communication from webview to native.
4.0.0 - Added cache (enabled by default).
3.0.0 - WKWebview: Add shared process pool so cookies and localStorage are shared across webviews in iOS (enabled by default).
2.0.0 - First release this is a replica of the core webview component
Upcoming:
- this.webView.postMessage() removal (never documented and less flexible than injectJavascript) -> how to migrate
- Kotlin rewrite
- Maybe Swift rewrite
Usage
Import the WebView
component from react-native-webview
and use it like so:
import React, { Component } from 'react';
import { StyleSheet, Text, View } from 'react-native';
import { WebView } from 'react-native-webview';
// ...
class MyWebComponent extends Component {
render() {
return <WebView source={{ uri: 'https://reactnative.dev/' }} />;
}
}
For more, read the API Reference and Guide. If you're interested in contributing, check out the Contributing Guide.
Common issues
- If you're getting
Invariant Violation: Native component for "RNCWebView does not exist"
it likely means you forgot to runreact-native link
or there was some error with the linking process
Contributing
See Contributing.md
Contributors
Thanks goes to these wonderful people (emoji key):
This project follows the all-contributors specification. Contributions of any kind welcome!
License
MIT
Translations
This readme is available in: