|
@@ -75,6 +75,7 @@ This document lays out the current public properties and methods for the React N
|
75
|
75
|
- [`clearCache`](Reference.md#clearCache)
|
76
|
76
|
- [`clearHistory`](Reference.md#clearHistory)
|
77
|
77
|
- [`requestFocus`](Reference.md#requestFocus)
|
|
78
|
+
|
78
|
79
|
---
|
79
|
80
|
|
80
|
81
|
# Reference
|
|
@@ -137,7 +138,7 @@ const INJECTED_JAVASCRIPT = `(function() {
|
137
|
138
|
})();`;
|
138
|
139
|
|
139
|
140
|
<WebView
|
140
|
|
- source={{ uri: 'https://facebook.github.io/react-native' }}
|
|
141
|
+ source={{ uri: 'https://reactnative.dev' }}
|
141
|
142
|
injectedJavaScript={INJECTED_JAVASCRIPT}
|
142
|
143
|
onMessage={this.onMessage}
|
143
|
144
|
/>;
|
|
@@ -166,7 +167,7 @@ const INJECTED_JAVASCRIPT = `(function() {
|
166
|
167
|
})();`;
|
167
|
168
|
|
168
|
169
|
<WebView
|
169
|
|
- source={{ uri: 'https://facebook.github.io/react-native' }}
|
|
170
|
+ source={{ uri: 'https://reactnative.dev' }}
|
170
|
171
|
injectedJavaScriptBeforeContentLoaded={INJECTED_JAVASCRIPT}
|
171
|
172
|
onMessage={this.onMessage}
|
172
|
173
|
/>;
|
|
@@ -214,7 +215,7 @@ Example:
|
214
|
215
|
|
215
|
216
|
```jsx
|
216
|
217
|
<WebView
|
217
|
|
- source={{ uri: 'https://facebook.github.io/react-native' }}
|
|
218
|
+ source={{ uri: 'https://reactnative.dev' }}
|
218
|
219
|
onError={syntheticEvent => {
|
219
|
220
|
const { nativeEvent } = syntheticEvent;
|
220
|
221
|
console.warn('WebView error: ', nativeEvent);
|
|
@@ -254,7 +255,7 @@ Example:
|
254
|
255
|
|
255
|
256
|
```jsx
|
256
|
257
|
<WebView
|
257
|
|
- source={{ uri: 'https://facebook.github.io/react-native' }}
|
|
258
|
+ source={{ uri: 'https://reactnative.dev' }}
|
258
|
259
|
onLoad={syntheticEvent => {
|
259
|
260
|
const { nativeEvent } = syntheticEvent;
|
260
|
261
|
this.url = nativeEvent.url;
|
|
@@ -287,7 +288,7 @@ Example:
|
287
|
288
|
|
288
|
289
|
```jsx
|
289
|
290
|
<WebView
|
290
|
|
- source={{ uri: 'https://facebook.github.io/react-native' }}
|
|
291
|
+ source={{ uri: 'https://reactnative.dev' }}
|
291
|
292
|
onLoadEnd={syntheticEvent => {
|
292
|
293
|
// update component to be aware of loading status
|
293
|
294
|
const { nativeEvent } = syntheticEvent;
|
|
@@ -321,7 +322,7 @@ Example:
|
321
|
322
|
|
322
|
323
|
```jsx
|
323
|
324
|
<WebView
|
324
|
|
- source={{ uri: 'https://facebook.github.io/react-native/=' }}
|
|
325
|
+ source={{ uri: 'https://reactnative.dev/=' }}
|
325
|
326
|
onLoadStart={syntheticEvent => {
|
326
|
327
|
// update component to be aware of loading status
|
327
|
328
|
const { nativeEvent } = syntheticEvent;
|
|
@@ -355,7 +356,7 @@ Example:
|
355
|
356
|
|
356
|
357
|
```jsx
|
357
|
358
|
<WebView
|
358
|
|
- source={{ uri: 'https://facebook.github.io/react-native' }}
|
|
359
|
+ source={{ uri: 'https://reactnative.dev' }}
|
359
|
360
|
onLoadProgress={({ nativeEvent }) => {
|
360
|
361
|
this.loadingProgress = nativeEvent.progress;
|
361
|
362
|
}}
|
|
@@ -391,7 +392,7 @@ Example:
|
391
|
392
|
|
392
|
393
|
```jsx
|
393
|
394
|
<WebView
|
394
|
|
- source={{ uri: 'https://facebook.github.io/react-native' }}
|
|
395
|
+ source={{ uri: 'https://reactnative.dev' }}
|
395
|
396
|
onHttpError={syntheticEvent => {
|
396
|
397
|
const { nativeEvent } = syntheticEvent;
|
397
|
398
|
console.warn(
|
|
@@ -446,7 +447,7 @@ Example:
|
446
|
447
|
|
447
|
448
|
```jsx
|
448
|
449
|
<WebView
|
449
|
|
- source={{ uri: 'https://facebook.github.io/react-native' }}
|
|
450
|
+ source={{ uri: 'https://reactnative.dev' }}
|
450
|
451
|
onNavigationStateChange={navState => {
|
451
|
452
|
// Keep track of going back navigation within component
|
452
|
453
|
this.canGoBack = navState.canGoBack;
|
|
@@ -482,7 +483,7 @@ Example:
|
482
|
483
|
|
483
|
484
|
```jsx
|
484
|
485
|
<WebView
|
485
|
|
- source={{ uri: 'https://facebook.github.io/react-native' }}
|
|
486
|
+ source={{ uri: 'https://reactnative.dev' }}
|
486
|
487
|
onContentProcessDidTerminate={syntheticEvent => {
|
487
|
488
|
const { nativeEvent } = syntheticEvent;
|
488
|
489
|
console.warn('Content process terminated, reloading', nativeEvent);
|
|
@@ -517,7 +518,7 @@ Example:
|
517
|
518
|
```jsx
|
518
|
519
|
//only allow URIs that begin with https:// or git://
|
519
|
520
|
<WebView
|
520
|
|
- source={{ uri: 'https://facebook.github.io/react-native' }}
|
|
521
|
+ source={{ uri: 'https://reactnative.dev' }}
|
521
|
522
|
originWhitelist={['https://*', 'git://*']}
|
522
|
523
|
/>
|
523
|
524
|
```
|
|
@@ -536,7 +537,7 @@ Example:
|
536
|
537
|
|
537
|
538
|
```jsx
|
538
|
539
|
<WebView
|
539
|
|
- source={{ uri: 'https://facebook.github.io/react-native' }}
|
|
540
|
+ source={{ uri: 'https://reactnative.dev' }}
|
540
|
541
|
renderError={errorName => <Error name={errorName} />}
|
541
|
542
|
/>
|
542
|
543
|
```
|
|
@@ -557,7 +558,7 @@ Example:
|
557
|
558
|
|
558
|
559
|
```jsx
|
559
|
560
|
<WebView
|
560
|
|
- source={{ uri: 'https://facebook.github.io/react-native' }}
|
|
561
|
+ source={{ uri: 'https://reactnative.dev' }}
|
561
|
562
|
startInLoadingState={true}
|
562
|
563
|
renderLoading={() => <Loading />}
|
563
|
564
|
/>
|
|
@@ -589,10 +590,10 @@ Example:
|
589
|
590
|
|
590
|
591
|
```jsx
|
591
|
592
|
<WebView
|
592
|
|
- source={{ uri: 'https://facebook.github.io/react-native' }}
|
|
593
|
+ source={{ uri: 'https://reactnative.dev' }}
|
593
|
594
|
onShouldStartLoadWithRequest={request => {
|
594
|
595
|
// Only allow navigating within this website
|
595
|
|
- return request.url.startsWith('https://facebook.github.io/react-native');
|
|
596
|
+ return request.url.startsWith('https://reactnative.dev');
|
596
|
597
|
}}
|
597
|
598
|
/>
|
598
|
599
|
```
|
|
@@ -635,7 +636,7 @@ Example:
|
635
|
636
|
|
636
|
637
|
```jsx
|
637
|
638
|
<WebView
|
638
|
|
- source={{ uri: 'https://facebook.github.io/react-native' }}
|
|
639
|
+ source={{ uri: 'https://reactnative.dev' }}
|
639
|
640
|
style={{ marginTop: 20 }}
|
640
|
641
|
/>
|
641
|
642
|
```
|
|
@@ -654,7 +655,7 @@ Example:
|
654
|
655
|
|
655
|
656
|
```jsx
|
656
|
657
|
<WebView
|
657
|
|
- source={{ uri: 'https://facebook.github.io/react-native' }}
|
|
658
|
+ source={{ uri: 'https://reactnative.dev' }}
|
658
|
659
|
containerStyle={{ marginTop: 20 }}
|
659
|
660
|
/>
|
660
|
661
|
```
|
|
@@ -750,7 +751,7 @@ Append to the existing user-agent. Setting `userAgent` will override this.
|
750
|
751
|
|
751
|
752
|
```jsx
|
752
|
753
|
<WebView
|
753
|
|
- source={{ uri: 'https://facebook.github.io/react-native' }}
|
|
754
|
+ source={{ uri: 'https://reactnative.dev' }}
|
754
|
755
|
applicationNameForUserAgent={'DemoApp/1.1.0'}
|
755
|
756
|
/>
|
756
|
757
|
// Resulting User-Agent will look like:
|
|
@@ -984,9 +985,9 @@ If true, this will hide the keyboard accessory view (< > and Done).
|
984
|
985
|
|
985
|
986
|
If true, this will be able horizontal swipe gestures. The default value is `false`.
|
986
|
987
|
|
987
|
|
-| Type | Required | Platform |
|
988
|
|
-| ------- | -------- | ----------------- |
|
989
|
|
-| boolean | No | iOS and macOS |
|
|
988
|
+| Type | Required | Platform |
|
|
989
|
+| ------- | -------- | ------------- |
|
|
990
|
+| boolean | No | iOS and macOS |
|
990
|
991
|
|
991
|
992
|
---
|
992
|
993
|
|
|
@@ -1061,9 +1062,9 @@ If the value of this property is true, the scroll view stops on multiples of the
|
1061
|
1062
|
|
1062
|
1063
|
A Boolean value that determines whether pressing on a link displays a preview of the destination for the link. In iOS this property is available on devices that support 3D Touch. In iOS 10 and later, the default value is true; before that, the default value is false.
|
1063
|
1064
|
|
1064
|
|
-| Type | Required | Platform |
|
1065
|
|
-| ------- | -------- | ----------------- |
|
1066
|
|
-| boolean | No | iOS and macOS |
|
|
1065
|
+| Type | Required | Platform |
|
|
1066
|
+| ------- | -------- | ------------- |
|
|
1067
|
+| boolean | No | iOS and macOS |
|
1067
|
1068
|
|
1068
|
1069
|
---
|
1069
|
1070
|
|
|
@@ -1071,9 +1072,9 @@ A Boolean value that determines whether pressing on a link displays a preview of
|
1071
|
1072
|
|
1072
|
1073
|
Set `true` if shared cookies from `[NSHTTPCookieStorage sharedHTTPCookieStorage]` should used for every load request in the WebView. The default value is `false`. For more on cookies, read the [Guide](Guide.md#Managing-Cookies)
|
1073
|
1074
|
|
1074
|
|
-| Type | Required | Platform |
|
1075
|
|
-| ------- | -------- | ----------------- |
|
1076
|
|
-| boolean | No | iOS and macOS |
|
|
1075
|
+| Type | Required | Platform |
|
|
1076
|
+| ------- | -------- | ------------- |
|
|
1077
|
+| boolean | No | iOS and macOS |
|
1077
|
1078
|
|
1078
|
1079
|
---
|
1079
|
1080
|
|
|
@@ -1150,30 +1151,34 @@ requestFocus();
|
1150
|
1151
|
Request the webView to ask for focus. (People working on TV apps might want having a look at this!)
|
1151
|
1152
|
|
1152
|
1153
|
### `clearFormData()`
|
|
1154
|
+
|
1153
|
1155
|
(android only)
|
1154
|
1156
|
|
1155
|
1157
|
```javascript
|
1156
|
1158
|
clearFormData();
|
1157
|
1159
|
```
|
1158
|
|
-Removes the autocomplete popup from the currently focused form field, if present. [developer.android.com reference](https://developer.android.com/reference/android/webkit/WebView.html#clearFormData())
|
1159
|
1160
|
|
|
1161
|
+Removes the autocomplete popup from the currently focused form field, if present. [developer.android.com reference](<https://developer.android.com/reference/android/webkit/WebView.html#clearFormData()>)
|
1160
|
1162
|
|
1161
|
1163
|
### `clearCache(bool)`
|
|
1164
|
+
|
1162
|
1165
|
(android only)
|
|
1166
|
+
|
1163
|
1167
|
```javascript
|
1164
|
1168
|
clearCache(true);
|
1165
|
1169
|
```
|
1166
|
1170
|
|
1167
|
|
-Clears the resource cache. Note that the cache is per-application, so this will clear the cache for all WebViews used. [developer.android.com reference](https://developer.android.com/reference/android/webkit/WebView.html#clearCache(boolean))
|
1168
|
|
-
|
|
1171
|
+Clears the resource cache. Note that the cache is per-application, so this will clear the cache for all WebViews used. [developer.android.com reference](<https://developer.android.com/reference/android/webkit/WebView.html#clearCache(boolean)>)
|
1169
|
1172
|
|
1170
|
1173
|
### `clearHistory()`
|
|
1174
|
+
|
1171
|
1175
|
(android only)
|
|
1176
|
+
|
1172
|
1177
|
```javascript
|
1173
|
1178
|
clearHistory();
|
1174
|
1179
|
```
|
1175
|
1180
|
|
1176
|
|
-Tells this WebView to clear its internal back/forward list. [developer.android.com reference](https://developer.android.com/reference/android/webkit/WebView.html#clearHistory())
|
|
1181
|
+Tells this WebView to clear its internal back/forward list. [developer.android.com reference](<https://developer.android.com/reference/android/webkit/WebView.html#clearHistory()>)
|
1177
|
1182
|
|
1178
|
1183
|
## Other Docs
|
1179
|
1184
|
|