Skip to content

Commit 7c2039b

Browse files
authored
docs(cndocs): sync platform-specific-code with upstream (#1019)
- Update code fences from jsx to tsx to match upstream - Add platform badges (Android/iOS) to version detection headers - Add missing note about Android API version vs OS version mapping
1 parent c9850cb commit 7c2039b

1 file changed

Lines changed: 12 additions & 10 deletions

File tree

cndocs/platform-specific-code.md

Lines changed: 12 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -16,7 +16,7 @@ React Native 提供了两种方法来区分平台:
1616

1717
React Native 提供了一个检测当前运行平台的模块。如果组件只有一小部分代码需要依据平台定制,那么这个模块就可以派上用场。
1818

19-
```jsx
19+
```tsx
2020
import {Platform, StyleSheet} from 'react-native';
2121

2222
const styles = StyleSheet.create({
@@ -28,7 +28,7 @@ const styles = StyleSheet.create({
2828

2929
还有个实用的方法是 Platform.select(),它可以以 Platform.OS 为 key,从传入的对象中返回对应平台的值,见下面的示例:
3030

31-
```jsx
31+
```tsx
3232
import {Platform, StyleSheet} from 'react-native';
3333

3434
const styles = StyleSheet.create({
@@ -54,7 +54,7 @@ const styles = StyleSheet.create({
5454

5555
这一方法可以接受任何合法类型的参数,因此你也可以直接用它针对不同平台返回不同的组件,像下面这样:
5656

57-
```jsx
57+
```tsx
5858
const Component = Platform.select({
5959
ios: () => require('ComponentIOS'),
6060
android: () => require('ComponentAndroid'),
@@ -63,7 +63,7 @@ const Component = Platform.select({
6363
<Component />;
6464
```
6565

66-
```jsx
66+
```tsx
6767
const Component = Platform.select({
6868
native: () => require('ComponentForNative'),
6969
default: () => require('ComponentForWeb'),
@@ -72,23 +72,25 @@ const Component = Platform.select({
7272
<Component />;
7373
```
7474

75-
### 检测 Android 版本
75+
### 检测 Android 版本 <div className="label android" title="此章节与 Android 平台相关">Android</div>
7676

7777
在 Android 上,`Version`属性是一个数字,表示 Android 的 api level:
7878

79-
```jsx
79+
```tsx
8080
import {Platform} from 'react-native';
8181

8282
if (Platform.Version === 25) {
8383
console.log('Running on Nougat!');
8484
}
8585
```
8686

87-
### 检测 iOS 版本
87+
**注意**`Version` 设置的是 Android API 版本,而不是 Android 操作系统版本。具体的映射关系请参考 [Android 版本历史](https://en.wikipedia.org/wiki/Android_version_history#Overview)
88+
89+
### 检测 iOS 版本 <div className="label ios" title="此章节与 iOS 平台相关">iOS</div>
8890

8991
在 iOS 上,`Version`属性是`-[UIDevice systemVersion]`的返回值,具体形式为一个表示当前系统版本的字符串。比如可能是"10.3"。
9092

91-
```jsx
93+
```tsx
9294
import {Platform} from 'react-native';
9395

9496
const majorVersionIOS = parseInt(Platform.Version, 10);
@@ -110,7 +112,7 @@ BigButton.android.js
110112

111113
然后去掉平台后缀直接引用:
112114

113-
```jsx
115+
```tsx
114116
import BigButton from './BigButton';
115117
```
116118

@@ -127,7 +129,7 @@ Container.native.js # 由 React Native 自带打包工具(Metro) 为ios和androi
127129

128130
在引用时并不需要添加`.native.`后缀:
129131

130-
```jsx
132+
```tsx
131133
import Container from './Container';
132134
```
133135

0 commit comments

Comments
 (0)