Deploy website - based on 228cd780cbbc6e902a037a53986e3fa05715f040

docs/platform-specific-code/index.html

@@ -4,6 +4,8 @@
 <meta charset="UTF-8">
 <meta name="viewport" content="width=device-width,initial-scale=1">
 <meta name="generator" content="Docusaurus v2.0.0-alpha.66">
+<link rel="alternate" type="application/rss+xml" href="/blog/rss.xml" title="React Native Blog RSS Feed">
+<link rel="alternate" type="application/atom+xml" href="/blog/atom.xml" title="React Native Blog Atom Feed">
 <link rel="preconnect" href="https://www.google-analytics.com">
 <script>window.ga=window.ga||function(){(ga.q=ga.q||[]).push(arguments)},ga.l=+new Date,ga("create","UA-41298772-2","auto"),ga("send","pageview")</script>
 <script async src="https://www.google-analytics.com/analytics.js"></script>
@@ -17,7 +19,7 @@
 <link rel="stylesheet" href="/main.27dc9db6.css">
 <link rel="preload" href="/styles.473a8a2f.js" as="script">
 <link rel="preload" href="/runtime~main.0980136f.js" as="script">
-<link rel="preload" href="/main.a73f7363.js" as="script">
+<link rel="preload" href="/main.6e57485c.js" as="script">
 <link rel="preload" href="/1.c2efdf9c.js" as="script">
 <link rel="preload" href="/2.df07bbe5.js" as="script">
 <link rel="preload" href="/938.2e1c99a7.js" as="script">
@@ -37,7 +39,7 @@
 </span></div><div class="token-line" style="color:#FFFFFF;background:#282C34"><span class="token plain"></span><span class="token keyword" style="color:#c5a5c5">const</span><span class="token plain"> majorVersionIOS </span><span class="token operator" style="color:#fc929e">=</span><span class="token plain"> </span><span class="token function" style="color:#79b6f2">parseInt</span><span class="token punctuation" style="color:#657b83">(</span><span class="token plain">Platform</span><span class="token punctuation" style="color:#657b83">.</span><span class="token plain">Version</span><span class="token punctuation" style="color:#657b83">,</span><span class="token plain"> </span><span class="token number" style="color:#5a9bcf">10</span><span class="token punctuation" style="color:#657b83">)</span><span class="token punctuation" style="color:#657b83">;</span><span class="token plain"></span></div><div class="token-line" style="color:#FFFFFF;background:#282C34"><span class="token plain"></span><span class="token keyword" style="color:#c5a5c5">if</span><span class="token plain"> </span><span class="token punctuation" style="color:#657b83">(</span><span class="token plain">majorVersionIOS </span><span class="token operator" style="color:#fc929e">&lt;=</span><span class="token plain"> </span><span class="token number" style="color:#5a9bcf">9</span><span class="token punctuation" style="color:#657b83">)</span><span class="token plain"> </span><span class="token punctuation" style="color:#657b83">{</span><span class="token plain"></span></div><div class="token-line" style="color:#FFFFFF;background:#282C34"><span class="token plain">  console</span><span class="token punctuation" style="color:#657b83">.</span><span class="token function" style="color:#79b6f2">log</span><span class="token punctuation" style="color:#657b83">(</span><span class="token string" style="color:#8dc891">&#x27;Work around a change in behavior&#x27;</span><span class="token punctuation" style="color:#657b83">)</span><span class="token punctuation" style="color:#657b83">;</span><span class="token plain"></span></div><div class="token-line" style="color:#FFFFFF;background:#282C34"><span class="token plain"></span><span class="token punctuation" style="color:#657b83">}</span></div></div></div></div></div><h2><a aria-hidden="true" tabindex="-1" class="anchor enhancedAnchor_2cZh" id="platform-specific-extensions"></a>Platform-specific extensions<a aria-hidden="true" tabindex="-1" class="hash-link" href="#platform-specific-extensions" title="Direct link to heading">#</a></h2><p>When your platform-specific code is more complex, you should consider splitting the code out into separate files. React Native will detect when a file has a <code>.ios.</code> or <code>.android.</code> extension and load the relevant platform file when required from other components.</p><p>For example, say you have the following files in your project:</p><div class="mdxCodeBlock_1XEh"><div class="codeBlockContent_1u-d"><button tabindex="0" type="button" aria-label="Copy code to clipboard" class="copyButton_10dd">Copy</button><div class="prism-code language-shell codeBlock_3iAC"><div class="codeBlockLines_b7E3" style="color:#FFFFFF;background:#282C34"><div class="token-line" style="color:#FFFFFF;background:#282C34"><span class="token plain">BigButton.ios.js</span></div><div class="token-line" style="color:#FFFFFF;background:#282C34"><span class="token plain">BigButton.android.js</span></div></div></div></div></div><p>You can then require the component as follows:</p><div class="mdxCodeBlock_1XEh"><div class="codeBlockContent_1u-d"><button tabindex="0" type="button" aria-label="Copy code to clipboard" class="copyButton_10dd">Copy</button><div class="prism-code language-jsx codeBlock_3iAC"><div class="codeBlockLines_b7E3" style="color:#FFFFFF;background:#282C34"><div class="token-line" style="color:#FFFFFF;background:#282C34"><span class="token keyword" style="color:#c5a5c5">import</span><span class="token plain"> BigButton </span><span class="token keyword" style="color:#c5a5c5">from</span><span class="token plain"> </span><span class="token string" style="color:#8dc891">&#x27;./BigButton&#x27;</span><span class="token punctuation" style="color:#657b83">;</span></div></div></div></div></div><p>React Native will automatically pick up the right file based on the running platform.</p><h2><a aria-hidden="true" tabindex="-1" class="anchor enhancedAnchor_2cZh" id="native-specific-extensions-ie-sharing-code-with-nodejs-and-web"></a>Native-specific extensions (i.e. sharing code with NodeJS and Web)<a aria-hidden="true" tabindex="-1" class="hash-link" href="#native-specific-extensions-ie-sharing-code-with-nodejs-and-web" title="Direct link to heading">#</a></h2><p>You can also use the <code>.native.js</code> extension when a module needs to be shared between NodeJS/Web and React Native but it has no Android/iOS differences. This is especially useful for projects that have common code shareLine truncated
 <script src="/styles.473a8a2f.js"></script>
 <script src="/runtime~main.0980136f.js"></script>
-<script src="/main.a73f7363.js"></script>
+<script src="/main.6e57485c.js"></script>
 <script src="/1.c2efdf9c.js"></script>
 <script src="/2.df07bbe5.js"></script>
 <script src="/938.2e1c99a7.js"></script>