@@ -16,7 +16,7 @@ React Native 提供了两种方法来区分平台:
1616
1717React Native 提供了一个检测当前运行平台的模块。如果组件只有一小部分代码需要依据平台定制,那么这个模块就可以派上用场。
1818
19- ``` jsx
19+ ``` tsx
2020import {Platform , StyleSheet } from ' react-native' ;
2121
2222const styles = StyleSheet .create ({
@@ -28,7 +28,7 @@ const styles = StyleSheet.create({
2828
2929还有个实用的方法是 Platform.select(),它可以以 Platform.OS 为 key,从传入的对象中返回对应平台的值,见下面的示例:
3030
31- ``` jsx
31+ ``` tsx
3232import {Platform , StyleSheet } from ' react-native' ;
3333
3434const styles = StyleSheet .create ({
@@ -54,7 +54,7 @@ const styles = StyleSheet.create({
5454
5555这一方法可以接受任何合法类型的参数,因此你也可以直接用它针对不同平台返回不同的组件,像下面这样:
5656
57- ``` jsx
57+ ``` tsx
5858const 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
6767const 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
8080import {Platform } from ' react-native' ;
8181
8282if (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
9294import {Platform } from ' react-native' ;
9395
9496const majorVersionIOS = parseInt (Platform .Version , 10 );
@@ -110,7 +112,7 @@ BigButton.android.js
110112
111113然后去掉平台后缀直接引用:
112114
113- ``` jsx
115+ ``` tsx
114116import 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
131133import Container from ' ./Container' ;
132134```
133135
0 commit comments