@aaxis/react-native-webview 中文文档教程

发布于 4年前 浏览 29 项目主页 更新于 3年前

React Native WebView - a Modern, Cross-Platform WebView for React Native

star 这个 repo欢迎 PR 所有贡献者已知漏洞NPM 版本Lean Core Extracted

来自 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

这个项目由这些人利用他们的空闲时间和公司工作时间免费维护。

Platforms Supported

  • [x] iOS
  • [x] Android
  • [x] macOS
  • [x] Windows

注意:Expo 对 React Native WebView 的支持始于 Expo SDK v33.0.0

Getting Started

阅读我们的入门指南。 如果任何步骤看起来不清楚,请创建一个详细的问题。

Versioning

该项目遵循语义版本控制。 我们会毫不犹豫地发布重大更改,但它们将是一个主要版本。

打破历史:

当前版本:version

  • 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 run react-native link or there was some error with the linking process

Contributing

请参阅 Contributing.md

Contributors

感谢这些优秀的人(表情符号键):

Thibault Malbranche
Thibault Malbranche

???? ???? ???? ???? ???? ⚠️ ???? ????
Jamon Holmgren
Jamon Holmgren

???? ???? ???? ???? ???? ⚠️ ???? ????
Andrei Pfeiffer
Andrei Pfeiffer

???? ???? ????
Michael Diarmid
Michael Diarmid

???? ???? ???? ????
Scott Mathson
Scott Mathson

???? ????
Margaret
Margaret

???? ????
Jordan Sexton
Jordan Sexton

???? ????
Malcolm Scruggs
Malcolm Scruggs

???? ???? ⚠️
Momazo7u7
Momazo7u7

????
Marco
Marco

????
Julien Eluard
Julien Eluard

????
Jian Wei
Jian Wei

???? ????
Sergei Butko
Sergei Butko

????
TMomemt
TMomemt

????
Eric Lewis
Eric Lewis

???? ????
Daniel Vicory
Daniel Vicory

???? ????

该项目遵循all-contributors 规范。 欢迎任何形式的贡献!

License

MIT

Translations

该自述文件可在以下位置找到:

React Native WebView - a Modern, Cross-Platform WebView for React Native

star this repoPRs WelcomeAll ContributorsKnown VulnerabilitiesNPM VersionLean Core Extracted

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.

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: 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 run react-native link or there was some error with the linking process

Contributing

See Contributing.md

Contributors

Thanks goes to these wonderful people (emoji key):

Thibault Malbranche
Thibault Malbranche

???? ???? ???? ???? ???? ⚠️ ???? ????
Jamon Holmgren
Jamon Holmgren

???? ???? ???? ???? ???? ⚠️ ???? ????
Andrei Pfeiffer
Andrei Pfeiffer

???? ???? ????
Michael Diarmid
Michael Diarmid

???? ???? ???? ????
Scott Mathson
Scott Mathson

???? ????
Margaret
Margaret

???? ????
Jordan Sexton
Jordan Sexton

???? ????
Malcolm Scruggs
Malcolm Scruggs

???? ???? ⚠️
Momazo7u7
Momazo7u7

????
Marco
Marco

????
Julien Eluard
Julien Eluard

????
Jian Wei
Jian Wei

???? ????
Sergei Butko
Sergei Butko

????
TMomemt
TMomemt

????
Eric Lewis
Eric Lewis

???? ????
Daniel Vicory
Daniel Vicory

???? ????

This project follows the all-contributors specification. Contributions of any kind welcome!

License

MIT

Translations

This readme is available in:

    我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
    原文