diff --git a/docs/next/platform-specific-code.html b/docs/next/platform-specific-code.html index c951ba229e4..86736bf672f 100644 --- a/docs/next/platform-specific-code.html +++ b/docs/next/platform-specific-code.html @@ -84,7 +84,7 @@ });

Platform.OS will be ios when running on iOS and android when running on Android.

-

There is also a Platform.select method available, that given an object containing Platform.OS as keys, returns the value for the platform you are currently running on.

+

There is also a Platform.select method available, that given an object where keys can be one of 'ios' | 'android' | 'native' | 'default', returns the most fitting value for the platform you are currently running on. That is, if you're running on a phone, ios and android keys will take preference. If those are not specified, native key will be used and then the default key.

import {Platform, StyleSheet} from 'react-native';
 
 const styles = StyleSheet.create({
@@ -95,6 +95,10 @@
         backgroundColor: 'red',
       },
       android: {
+        backgroundColor: 'green',
+      },
+      default: {
+        // other platforms, web for example
         backgroundColor: 'blue',
       },
     }),
@@ -108,6 +112,13 @@
   android: () => require('ComponentAndroid'),
 })();
 
+<Component />;
+
+
const Component = Platform.select({
+  native: () => require('ComponentForNative'),
+  default: () => require('ComponentForWeb'),
+})();
+
 <Component />;

Detecting the Android version

diff --git a/docs/next/platform-specific-code/index.html b/docs/next/platform-specific-code/index.html index c951ba229e4..86736bf672f 100644 --- a/docs/next/platform-specific-code/index.html +++ b/docs/next/platform-specific-code/index.html @@ -84,7 +84,7 @@ });

Platform.OS will be ios when running on iOS and android when running on Android.

-

There is also a Platform.select method available, that given an object containing Platform.OS as keys, returns the value for the platform you are currently running on.

+

There is also a Platform.select method available, that given an object where keys can be one of 'ios' | 'android' | 'native' | 'default', returns the most fitting value for the platform you are currently running on. That is, if you're running on a phone, ios and android keys will take preference. If those are not specified, native key will be used and then the default key.

import {Platform, StyleSheet} from 'react-native';
 
 const styles = StyleSheet.create({
@@ -95,6 +95,10 @@
         backgroundColor: 'red',
       },
       android: {
+        backgroundColor: 'green',
+      },
+      default: {
+        // other platforms, web for example
         backgroundColor: 'blue',
       },
     }),
@@ -108,6 +112,13 @@
   android: () => require('ComponentAndroid'),
 })();
 
+<Component />;
+
+
const Component = Platform.select({
+  native: () => require('ComponentForNative'),
+  default: () => require('ComponentForWeb'),
+})();
+
 <Component />;

Detecting the Android version