mirror of
https://github.com/facebook/react-native.git
synced 2025-11-01 09:14:26 +00:00
Updated docs for 0.29
This commit is contained in:
@@ -1240,7 +1240,7 @@ div[data-twttr-id] iframe {
|
||||
.methodTitle {
|
||||
font-weight: bold;
|
||||
font-size: 24px;
|
||||
color: #E9967A;
|
||||
color: #2F9C0A;
|
||||
}
|
||||
|
||||
.compactProps .methodTitle {
|
||||
|
||||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
@@ -8,12 +8,12 @@ class <span class="token class-name">Bananas</span> extends <span class="token c
|
||||
uri<span class="token punctuation">:</span> <span class="token string">'https://upload.wikimedia.org/wikipedia/commons/d/de/Bananavarieties.jpg'</span>
|
||||
<span class="token punctuation">}</span><span class="token punctuation">;</span>
|
||||
<span class="token keyword">return</span> <span class="token punctuation">(</span>
|
||||
<Image source<span class="token operator">=</span><span class="token punctuation">{</span>pic<span class="token punctuation">}</span> <span class="token operator">/</span><span class="token operator">></span>
|
||||
<Image source<span class="token operator">=</span><span class="token punctuation">{</span>pic<span class="token punctuation">}</span> style<span class="token operator">=</span><span class="token punctuation">{</span><span class="token punctuation">{</span>width<span class="token punctuation">:</span> <span class="token number">193</span><span class="token punctuation">,</span> height<span class="token punctuation">:</span> <span class="token number">110</span><span class="token punctuation">}</span><span class="token punctuation">}</span><span class="token operator">/</span><span class="token operator">></span>
|
||||
<span class="token punctuation">)</span><span class="token punctuation">;</span>
|
||||
<span class="token punctuation">}</span>
|
||||
<span class="token punctuation">}</span>
|
||||
|
||||
AppRegistry<span class="token punctuation">.</span><span class="token function">registerComponent<span class="token punctuation">(</span></span><span class="token string">'Bananas'</span><span class="token punctuation">,</span> <span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token operator">=</span><span class="token operator">></span> Bananas<span class="token punctuation">)</span><span class="token punctuation">;</span></div><iframe style="margin-top:4px;" width="880" height="420" data-src="//npmcdn.com/react-native-web-player@1.0.0/index.html#code=import%20React%2C%20%7B%20Component%20%7D%20from%20'react'%3B%0Aimport%20%7B%20AppRegistry%2C%20Image%20%7D%20from%20'react-native'%3B%0A%0Aclass%20Bananas%20extends%20Component%20%7B%0A%20%20render()%20%7B%0A%20%20%20%20let%20pic%20%3D%20%7B%0A%20%20%20%20%20%20uri%3A%20'https%3A%2F%2Fupload.wikimedia.org%2Fwikipedia%2Fcommons%2Fd%2Fde%2FBananavarieties.jpg'%0A%20%20%20%20%7D%3B%0A%20%20%20%20return%20(%0A%20%20%20%20%20%20%3CImage%20source%3D%7Bpic%7D%20%2F%3E%0A%20%20%20%20)%3B%0A%20%20%7D%0A%7D%0A%0AAppRegistry.registerComponent('Bananas'%2C%20()%20%3D%3E%20Bananas)%3B" frameborder="0"></iframe></div><p>Notice that <code>{pic}</code> is surrounded by braces, to embed the variable <code>pic</code> into JSX. You can put any JavaScript expression inside braces in JSX.</p><p>Your own components can also use <code>props</code>. This lets you make a single component
|
||||
AppRegistry<span class="token punctuation">.</span><span class="token function">registerComponent<span class="token punctuation">(</span></span><span class="token string">'Bananas'</span><span class="token punctuation">,</span> <span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token operator">=</span><span class="token operator">></span> Bananas<span class="token punctuation">)</span><span class="token punctuation">;</span></div><iframe style="margin-top:4px;" width="880" height="420" data-src="//npmcdn.com/react-native-web-player@1.0.0/index.html#code=import%20React%2C%20%7B%20Component%20%7D%20from%20'react'%3B%0Aimport%20%7B%20AppRegistry%2C%20Image%20%7D%20from%20'react-native'%3B%0A%0Aclass%20Bananas%20extends%20Component%20%7B%0A%20%20render()%20%7B%0A%20%20%20%20let%20pic%20%3D%20%7B%0A%20%20%20%20%20%20uri%3A%20'https%3A%2F%2Fupload.wikimedia.org%2Fwikipedia%2Fcommons%2Fd%2Fde%2FBananavarieties.jpg'%0A%20%20%20%20%7D%3B%0A%20%20%20%20return%20(%0A%20%20%20%20%20%20%3CImage%20source%3D%7Bpic%7D%20style%3D%7B%7Bwidth%3A%20193%2C%20height%3A%20110%7D%7D%2F%3E%0A%20%20%20%20)%3B%0A%20%20%7D%0A%7D%0A%0AAppRegistry.registerComponent('Bananas'%2C%20()%20%3D%3E%20Bananas)%3B" frameborder="0"></iframe></div><p>Notice that <code>{pic}</code> is surrounded by braces, to embed the variable <code>pic</code> into JSX. You can put any JavaScript expression inside braces in JSX.</p><p>Your own components can also use <code>props</code>. This lets you make a single component
|
||||
that is used in many different places in your app, with slightly different
|
||||
properties in each place. Just refer to <code>this.props</code> in your <code>render</code> function. Here's an example:</p><div class="web-player"><div class="prism language-javascript">import React<span class="token punctuation">,</span> <span class="token punctuation">{</span> Component <span class="token punctuation">}</span> from <span class="token string">'react'</span><span class="token punctuation">;</span>
|
||||
import <span class="token punctuation">{</span> AppRegistry<span class="token punctuation">,</span> Text<span class="token punctuation">,</span> View <span class="token punctuation">}</span> from <span class="token string">'react-native'</span><span class="token punctuation">;</span>
|
||||
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 151 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 63 KiB |
+2
-2
@@ -1,4 +1,4 @@
|
||||
<!DOCTYPE html><html><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"><title>Documentation archive – React Native | A framework for building native apps using React</title><meta name="viewport" content="width=device-width"><meta property="og:title" content="Documentation archive – React Native | A framework for building native apps using React"><meta property="og:type" content="website"><meta property="og:url" content="http://facebook.github.io/react-native/index.html"><meta property="og:image" content="http://facebook.github.io/react-native/img/opengraph.png?2"><meta property="og:description" content="A framework for building native apps using React"><base href="/react-native/releases/next/"><link rel="stylesheet" href="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.css"><link rel="shortcut icon" href="img/favicon.png?2"><link rel="stylesheet" href="css/react-native.css"><script type="text/javascript" src="//use.typekit.net/vqa1hcx.js"></script><script type="text/javascript">try{Typekit.load();}catch(e){}</script></head><body><div class="container"><div class="nav-main"><div class="wrap"><a class="nav-home" href=""><img src="img/header_logo.png">React Native</a><a class="nav-version" href="/react-native/versions.html">next</a><div class="nav-site-wrapper"><ul class="nav-site nav-site-internal"><li><a href="docs/getting-started.html" class="" data-target=".nav-docs">Docs</a></li><li><a href="support.html" class="">Support</a></li><li><a href="showcase.html" class="">Showcase</a></li><li><a href="blog/" class="">Blog</a></li></ul><div class="algolia-search-wrapper"><input id="algolia-doc-search" type="text" placeholder="Search docs..."></div><ul class="nav-site nav-site-external"><li><a href="https://github.com/facebook/react-native" class="">GitHub</a></li><li><a href="http://facebook.github.io/react" class="">React</a></li></ul></div></div></div><section class="content wrap documentationContent nosidebar"><div class="inner-content"><h1>React Native Versions</h1><p>React Native is following a 2-week train release. Every two weeks, a Release Candidate (rc) branch is created off of master and the previous rc branch is being officially released.</p><table class="versions"><tbody><tr><th>master</th><td><a href="/react-native/releases/next">Docs</a></td><td></td></tr><tr><th>0.29-rc</th><td><a href="/react-native/releases/0.29">Docs</a></td><td><a href="https://github.com/facebook/react-native/releases/tag/v0.29.0-rc">Release Notes</a></td></tr><tr><th>(current) 0.28</th><td><a href="/react-native">Docs</a></td><td><a href="https://github.com/facebook/react-native/releases/tag/v0.28.0">Release Notes</a></td></tr><tr><th>0.27</th><td><a href="/react-native/releases/0.27">Docs</a></td><td><a href="https://github.com/facebook/react-native/releases/tag/v0.27.0">Release Notes</a></td></tr><tr><th>0.26</th><td><a href="/react-native/releases/0.26">Docs</a></td><td><a href="https://github.com/facebook/react-native/releases/tag/v0.26.0">Release Notes</a></td></tr><tr><th>0.25</th><td><a href="/react-native/releases/0.25">Docs</a></td><td><a href="https://github.com/facebook/react-native/releases/tag/v0.25.0">Release Notes</a></td></tr><tr><th>0.24</th><td><a href="/react-native/releases/0.24">Docs</a></td><td><a href="https://github.com/facebook/react-native/releases/tag/v0.24.0">Release Notes</a></td></tr><tr><th>0.23</th><td><a href="/react-native/releases/0.23">Docs</a></td><td><a href="https://github.com/facebook/react-native/releases/tag/v0.23.0">Release Notes</a></td></tr><tr><th>0.22</th><td><a href="/react-native/releases/0.22">Docs</a></td><td><a href="https://github.com/facebook/react-native/releases/tag/v0.22.0">Release Notes</a></td></tr><tr><th>0.21</th><td><a href="/react-native/releases/0.21">Docs</a></td><td><a href="https://github.com/facebook/react-native/releases/tag/v0.21.0">Release Notes</a></td></tr><tr><th>0.20</th><td><a href="/react-native/releases/0.20">Docs</a></td><td><a href="https://github.com/facebook/react-native/releases/tag/v0.20.0">Release Notes</a></td></tr><tr><th>0.19</th><td><a href="/react-native/releases/0.19">Docs</a></td><td><a href="https://github.com/facebook/react-native/releases/tag/v0.19.0">Release Notes</a></td></tr><tr><th>0.18</th><td><a href="/react-native/releases/0.18">Docs</a></td><td><a href="https://github.com/facebook/react-native/releases/tag/v0.18.0">Release Notes</a></td></tr></tbody></table></div></section><footer class="wrap"><div class="center">© 2016 Facebook Inc.</div></footer></div><div id="fb-root"></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>
|
||||
<!DOCTYPE html><html><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"><title>Documentation archive – React Native | A framework for building native apps using React</title><meta name="viewport" content="width=device-width"><meta property="og:title" content="Documentation archive – React Native | A framework for building native apps using React"><meta property="og:type" content="website"><meta property="og:url" content="http://facebook.github.io/react-native/index.html"><meta property="og:image" content="http://facebook.github.io/react-native/img/opengraph.png?2"><meta property="og:description" content="A framework for building native apps using React"><base href="/react-native/releases/0.29/"><link rel="stylesheet" href="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.css"><link rel="shortcut icon" href="img/favicon.png?2"><link rel="stylesheet" href="css/react-native.css"><script type="text/javascript" src="//use.typekit.net/vqa1hcx.js"></script><script type="text/javascript">try{Typekit.load();}catch(e){}</script></head><body><div class="container"><div class="nav-main"><div class="wrap"><a class="nav-home" href=""><img src="img/header_logo.png">React Native</a><a class="nav-version" href="/react-native/versions.html">0.29</a><div class="nav-site-wrapper"><ul class="nav-site nav-site-internal"><li><a href="docs/getting-started.html" class="" data-target=".nav-docs">Docs</a></li><li><a href="support.html" class="">Support</a></li><li><a href="showcase.html" class="">Showcase</a></li><li><a href="blog/" class="">Blog</a></li></ul><div class="algolia-search-wrapper"><input id="algolia-doc-search" type="text" placeholder="Search docs..."></div><ul class="nav-site nav-site-external"><li><a href="https://github.com/facebook/react-native" class="">GitHub</a></li><li><a href="http://facebook.github.io/react" class="">React</a></li></ul></div></div></div><section class="content wrap documentationContent nosidebar"><div class="inner-content"><h1>React Native Versions</h1><p>React Native is following a 2-week train release. Every two weeks, a Release Candidate (rc) branch is created off of master and the previous rc branch is being officially released.</p><table class="versions"><tbody><tr><th>master</th><td><a href="/react-native/releases/next">Docs</a></td><td></td></tr><tr><th>0.29-rc</th><td><a href="/react-native/releases/0.29">Docs</a></td><td><a href="https://github.com/facebook/react-native/releases/tag/v0.29.0-rc">Release Notes</a></td></tr><tr><th>(current) 0.28</th><td><a href="/react-native">Docs</a></td><td><a href="https://github.com/facebook/react-native/releases/tag/v0.28.0">Release Notes</a></td></tr><tr><th>0.27</th><td><a href="/react-native/releases/0.27">Docs</a></td><td><a href="https://github.com/facebook/react-native/releases/tag/v0.27.0">Release Notes</a></td></tr><tr><th>0.26</th><td><a href="/react-native/releases/0.26">Docs</a></td><td><a href="https://github.com/facebook/react-native/releases/tag/v0.26.0">Release Notes</a></td></tr><tr><th>0.25</th><td><a href="/react-native/releases/0.25">Docs</a></td><td><a href="https://github.com/facebook/react-native/releases/tag/v0.25.0">Release Notes</a></td></tr><tr><th>0.24</th><td><a href="/react-native/releases/0.24">Docs</a></td><td><a href="https://github.com/facebook/react-native/releases/tag/v0.24.0">Release Notes</a></td></tr><tr><th>0.23</th><td><a href="/react-native/releases/0.23">Docs</a></td><td><a href="https://github.com/facebook/react-native/releases/tag/v0.23.0">Release Notes</a></td></tr><tr><th>0.22</th><td><a href="/react-native/releases/0.22">Docs</a></td><td><a href="https://github.com/facebook/react-native/releases/tag/v0.22.0">Release Notes</a></td></tr><tr><th>0.21</th><td><a href="/react-native/releases/0.21">Docs</a></td><td><a href="https://github.com/facebook/react-native/releases/tag/v0.21.0">Release Notes</a></td></tr><tr><th>0.20</th><td><a href="/react-native/releases/0.20">Docs</a></td><td><a href="https://github.com/facebook/react-native/releases/tag/v0.20.0">Release Notes</a></td></tr><tr><th>0.19</th><td><a href="/react-native/releases/0.19">Docs</a></td><td><a href="https://github.com/facebook/react-native/releases/tag/v0.19.0">Release Notes</a></td></tr><tr><th>0.18</th><td><a href="/react-native/releases/0.18">Docs</a></td><td><a href="https://github.com/facebook/react-native/releases/tag/v0.18.0">Release Notes</a></td></tr></tbody></table></div></section><footer class="wrap"><div class="center">© 2016 Facebook Inc.</div></footer></div><div id="fb-root"></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>
|
||||
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
|
||||
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
|
||||
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
|
||||
@@ -14,6 +14,6 @@
|
||||
apiKey: '2c98749b4a1e588efec53b2acec13025',
|
||||
indexName: 'react-native-versions',
|
||||
inputSelector: '#algolia-doc-search',
|
||||
algoliaOptions: { facetFilters: [ "tags:master" ], hitsPerPage: 5 }
|
||||
algoliaOptions: { facetFilters: [ "tags:0.29" ], hitsPerPage: 5 }
|
||||
});
|
||||
</script><script src="js/scripts.js"></script></body></html>
|
||||
Reference in New Issue
Block a user