Facebook/react-native
1
0
Fork 0
mirror of https://github.com/facebook/react-native.git synced 2025-11-01 09:14:26 +00:00
Code Issues Packages Projects Releases Wiki Activity

Deploy website

Browse Source 
Deploy website version based on c06a5cffe6
This commit is contained in:
Website Deployment Script
2017-12-05 19:58:34 +00:00
parent c06a5cffe6
commit 0a1ef9bc4d
135 changed files with 159 additions and 159 deletions
Download Patch File Download Diff File Expand all files Collapse all files
docs/0.10/sectionlist.html
+1 -1
View File
@@ -12,7 +12,7 @@
<li>Scroll loading.</li>
</ul>
<p>If you don't need section support and want a simpler interface, use
<a href="/react-native/flatlist.md"><code>&lt;FlatList&gt;</code></a>.</p>
<a href="/react-native/docs/0.10/flatlist.html"><code>&lt;FlatList&gt;</code></a>.</p>
<p>Simple Examples:</p>
<pre><code class="hljs css javascript">&lt;SectionList
renderItem={({item}) =&gt; &lt;ListItem title={item} /&gt;}
docs/0.10/virtualizedlist.html
+1 -1
View File
@@ -1,4 +1,4 @@
<html><head><meta charset="utf-8"/><meta http-equiv="X-UA-Compatible" content="IE=edge, chrome=1"/><title>VirtualizedList · React Native</title><meta name="viewport" content="width=device-width"/><meta name="generator" content="Docusaurus"/><meta property="og:title" content="VirtualizedList · React Native"/><meta property="og:type" content="website"/><meta property="og:url" content="https://facebook.github.io/react-native/index.html"/><meta property="og:description" content="Base implementation for the more convenient [`&lt;FlatList&gt;`](/react-native/flatlist.md) and [`&lt;SectionList&gt;`](/react-native/sectionlist.md) components, which are also better documented. In general, this should only really be used if you need more flexibility than `FlatList` provides, e.g. for use with immutable data instead of plain arrays."/><link rel="shortcut icon" href="/react-native/img/favicon.png"/><link rel="stylesheet" href="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.css"/><link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/solarized-dark.min.css"/><link rel="alternate" type="application/atom+xml" href="https://facebook.github.io/blog/atom.xml" title="React Native Blog ATOM Feed"/><link rel="alternate" type="application/rss+xml" href="https://facebook.github.io/blog/feed.xml" title="React Native Blog RSS Feed"/><script type="text/javascript" src="https://snack.expo.io/embed.js"></script><script type="text/javascript" src="/react-native/js/codeblocks.js"></script><link rel="stylesheet" href="/react-native/css/main.css"/></head><body class="sideNavVisible"><div class="fixedHeaderContainer"><div class="headerWrapper wrapper"><header><a href="/react-native/"><img class="logo" src="/react-native/img/header_logo.png"/><h2 class="headerTitle">React Native</h2></a><a href="/react-native/versions.html"><h3>0.10</h3></a><div class="navigationWrapper navigationSlider"><nav class="slidingNav"><ul class="nav-site nav-site-internal"><li><a href="/react-native/docs/0.10/getting-started.html" target="_self">Docs</a></li><li><a href="/react-native/en/help.html" target="_self">Community</a></li><li><a href="/react-native/blog" target="_self">Blog</a></li><li class="navSearchWrapper reactNavSearchWrapper"><input type="text" id="search_input_react" placeholder="Search"/></li><li><a href="https://github.com/facebook/react-native" target="_self">GitHub</a></li><li><a href="https://reactjs.org/" target="_self">React</a></li></ul></nav></div></header></div></div><div class="navPusher"><div class="docMainWrapper wrapper"><div class="container mainContainer"><div class="wrapper"><div class="post"><header class="postHeader"><a class="edit-page-link button" href="https://github.com/facebook/react-native-website/blob/master/website/versioned_docs/version-0.5/virtualizedlist.md" target="_blank">Edit</a><h1>VirtualizedList</h1></header><article><div><span><p>Base implementation for the more convenient <a href="/react-native/flatlist.md"><code>&lt;FlatList&gt;</code></a> and <a href="/react-native/sectionlist.md"><code>&lt;SectionList&gt;</code></a> components, which are also better documented. In general, this should only really be used if you need more flexibility than <code>FlatList</code> provides, e.g. for use with immutable data instead of plain arrays.</p>
<html><head><meta charset="utf-8"/><meta http-equiv="X-UA-Compatible" content="IE=edge, chrome=1"/><title>VirtualizedList · React Native</title><meta name="viewport" content="width=device-width"/><meta name="generator" content="Docusaurus"/><meta property="og:title" content="VirtualizedList · React Native"/><meta property="og:type" content="website"/><meta property="og:url" content="https://facebook.github.io/react-native/index.html"/><meta property="og:description" content="Base implementation for the more convenient [`&lt;FlatList&gt;`](/react-native/docs/0.10/flatlist.html) and [`&lt;SectionList&gt;`](/react-native/docs/0.10/sectionlist.html) components, which are also better documented. In general, this should only really be used if you need more flexibility than `FlatList` provides, e.g. for use with immutable data instead of plain arrays."/><link rel="shortcut icon" href="/react-native/img/favicon.png"/><link rel="stylesheet" href="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.css"/><link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/solarized-dark.min.css"/><link rel="alternate" type="application/atom+xml" href="https://facebook.github.io/blog/atom.xml" title="React Native Blog ATOM Feed"/><link rel="alternate" type="application/rss+xml" href="https://facebook.github.io/blog/feed.xml" title="React Native Blog RSS Feed"/><script type="text/javascript" src="https://snack.expo.io/embed.js"></script><script type="text/javascript" src="/react-native/js/codeblocks.js"></script><link rel="stylesheet" href="/react-native/css/main.css"/></head><body class="sideNavVisible"><div class="fixedHeaderContainer"><div class="headerWrapper wrapper"><header><a href="/react-native/"><img class="logo" src="/react-native/img/header_logo.png"/><h2 class="headerTitle">React Native</h2></a><a href="/react-native/versions.html"><h3>0.10</h3></a><div class="navigationWrapper navigationSlider"><nav class="slidingNav"><ul class="nav-site nav-site-internal"><li><a href="/react-native/docs/0.10/getting-started.html" target="_self">Docs</a></li><li><a href="/react-native/en/help.html" target="_self">Community</a></li><li><a href="/react-native/blog" target="_self">Blog</a></li><li class="navSearchWrapper reactNavSearchWrapper"><input type="text" id="search_input_react" placeholder="Search"/></li><li><a href="https://github.com/facebook/react-native" target="_self">GitHub</a></li><li><a href="https://reactjs.org/" target="_self">React</a></li></ul></nav></div></header></div></div><div class="navPusher"><div class="docMainWrapper wrapper"><div class="container mainContainer"><div class="wrapper"><div class="post"><header class="postHeader"><a class="edit-page-link button" href="https://github.com/facebook/react-native-website/blob/master/website/versioned_docs/version-0.5/virtualizedlist.md" target="_blank">Edit</a><h1>VirtualizedList</h1></header><article><div><span><p>Base implementation for the more convenient <a href="/react-native/docs/0.10/flatlist.html"><code>&lt;FlatList&gt;</code></a> and <a href="/react-native/docs/0.10/sectionlist.html"><code>&lt;SectionList&gt;</code></a> components, which are also better documented. In general, this should only really be used if you need more flexibility than <code>FlatList</code> provides, e.g. for use with immutable data instead of plain arrays.</p>
<p>Virtualization massively improves memory consumption and performance of large lists by maintaining a finite render window of active items and replacing all items outside of the render window with appropriately sized blank space. The window adapts to scrolling behavior, and items are rendered incrementally with low-pri (after any running interactions) if they are far from the visible area, or with hi-pri otherwise to minimize the potential of seeing blank space.</p>
<p>Some caveats:</p>
<ul>
docs/0.11/sectionlist.html
+1 -1
View File
@@ -12,7 +12,7 @@
<li>Scroll loading.</li>
</ul>
<p>If you don't need section support and want a simpler interface, use
<a href="/react-native/flatlist.md"><code>&lt;FlatList&gt;</code></a>.</p>
<a href="/react-native/docs/0.11/flatlist.html"><code>&lt;FlatList&gt;</code></a>.</p>
<p>Simple Examples:</p>
<pre><code class="hljs css javascript">&lt;SectionList
renderItem={({item}) =&gt; &lt;ListItem title={item} /&gt;}
docs/0.11/virtualizedlist.html
+1 -1
View File
@@ -1,4 +1,4 @@
<html><head><meta charset="utf-8"/><meta http-equiv="X-UA-Compatible" content="IE=edge, chrome=1"/><title>VirtualizedList · React Native</title><meta name="viewport" content="width=device-width"/><meta name="generator" content="Docusaurus"/><meta property="og:title" content="VirtualizedList · React Native"/><meta property="og:type" content="website"/><meta property="og:url" content="https://facebook.github.io/react-native/index.html"/><meta property="og:description" content="Base implementation for the more convenient [`&lt;FlatList&gt;`](/react-native/flatlist.md) and [`&lt;SectionList&gt;`](/react-native/sectionlist.md) components, which are also better documented. In general, this should only really be used if you need more flexibility than `FlatList` provides, e.g. for use with immutable data instead of plain arrays."/><link rel="shortcut icon" href="/react-native/img/favicon.png"/><link rel="stylesheet" href="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.css"/><link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/solarized-dark.min.css"/><link rel="alternate" type="application/atom+xml" href="https://facebook.github.io/blog/atom.xml" title="React Native Blog ATOM Feed"/><link rel="alternate" type="application/rss+xml" href="https://facebook.github.io/blog/feed.xml" title="React Native Blog RSS Feed"/><script type="text/javascript" src="https://snack.expo.io/embed.js"></script><script type="text/javascript" src="/react-native/js/codeblocks.js"></script><link rel="stylesheet" href="/react-native/css/main.css"/></head><body class="sideNavVisible"><div class="fixedHeaderContainer"><div class="headerWrapper wrapper"><header><a href="/react-native/"><img class="logo" src="/react-native/img/header_logo.png"/><h2 class="headerTitle">React Native</h2></a><a href="/react-native/versions.html"><h3>0.11</h3></a><div class="navigationWrapper navigationSlider"><nav class="slidingNav"><ul class="nav-site nav-site-internal"><li><a href="/react-native/docs/0.11/getting-started.html" target="_self">Docs</a></li><li><a href="/react-native/en/help.html" target="_self">Community</a></li><li><a href="/react-native/blog" target="_self">Blog</a></li><li class="navSearchWrapper reactNavSearchWrapper"><input type="text" id="search_input_react" placeholder="Search"/></li><li><a href="https://github.com/facebook/react-native" target="_self">GitHub</a></li><li><a href="https://reactjs.org/" target="_self">React</a></li></ul></nav></div></header></div></div><div class="navPusher"><div class="docMainWrapper wrapper"><div class="container mainContainer"><div class="wrapper"><div class="post"><header class="postHeader"><a class="edit-page-link button" href="https://github.com/facebook/react-native-website/blob/master/website/versioned_docs/version-0.5/virtualizedlist.md" target="_blank">Edit</a><h1>VirtualizedList</h1></header><article><div><span><p>Base implementation for the more convenient <a href="/react-native/flatlist.md"><code>&lt;FlatList&gt;</code></a> and <a href="/react-native/sectionlist.md"><code>&lt;SectionList&gt;</code></a> components, which are also better documented. In general, this should only really be used if you need more flexibility than <code>FlatList</code> provides, e.g. for use with immutable data instead of plain arrays.</p>
<html><head><meta charset="utf-8"/><meta http-equiv="X-UA-Compatible" content="IE=edge, chrome=1"/><title>VirtualizedList · React Native</title><meta name="viewport" content="width=device-width"/><meta name="generator" content="Docusaurus"/><meta property="og:title" content="VirtualizedList · React Native"/><meta property="og:type" content="website"/><meta property="og:url" content="https://facebook.github.io/react-native/index.html"/><meta property="og:description" content="Base implementation for the more convenient [`&lt;FlatList&gt;`](/react-native/docs/0.11/flatlist.html) and [`&lt;SectionList&gt;`](/react-native/docs/0.11/sectionlist.html) components, which are also better documented. In general, this should only really be used if you need more flexibility than `FlatList` provides, e.g. for use with immutable data instead of plain arrays."/><link rel="shortcut icon" href="/react-native/img/favicon.png"/><link rel="stylesheet" href="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.css"/><link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/solarized-dark.min.css"/><link rel="alternate" type="application/atom+xml" href="https://facebook.github.io/blog/atom.xml" title="React Native Blog ATOM Feed"/><link rel="alternate" type="application/rss+xml" href="https://facebook.github.io/blog/feed.xml" title="React Native Blog RSS Feed"/><script type="text/javascript" src="https://snack.expo.io/embed.js"></script><script type="text/javascript" src="/react-native/js/codeblocks.js"></script><link rel="stylesheet" href="/react-native/css/main.css"/></head><body class="sideNavVisible"><div class="fixedHeaderContainer"><div class="headerWrapper wrapper"><header><a href="/react-native/"><img class="logo" src="/react-native/img/header_logo.png"/><h2 class="headerTitle">React Native</h2></a><a href="/react-native/versions.html"><h3>0.11</h3></a><div class="navigationWrapper navigationSlider"><nav class="slidingNav"><ul class="nav-site nav-site-internal"><li><a href="/react-native/docs/0.11/getting-started.html" target="_self">Docs</a></li><li><a href="/react-native/en/help.html" target="_self">Community</a></li><li><a href="/react-native/blog" target="_self">Blog</a></li><li class="navSearchWrapper reactNavSearchWrapper"><input type="text" id="search_input_react" placeholder="Search"/></li><li><a href="https://github.com/facebook/react-native" target="_self">GitHub</a></li><li><a href="https://reactjs.org/" target="_self">React</a></li></ul></nav></div></header></div></div><div class="navPusher"><div class="docMainWrapper wrapper"><div class="container mainContainer"><div class="wrapper"><div class="post"><header class="postHeader"><a class="edit-page-link button" href="https://github.com/facebook/react-native-website/blob/master/website/versioned_docs/version-0.5/virtualizedlist.md" target="_blank">Edit</a><h1>VirtualizedList</h1></header><article><div><span><p>Base implementation for the more convenient <a href="/react-native/docs/0.11/flatlist.html"><code>&lt;FlatList&gt;</code></a> and <a href="/react-native/docs/0.11/sectionlist.html"><code>&lt;SectionList&gt;</code></a> components, which are also better documented. In general, this should only really be used if you need more flexibility than <code>FlatList</code> provides, e.g. for use with immutable data instead of plain arrays.</p>
<p>Virtualization massively improves memory consumption and performance of large lists by maintaining a finite render window of active items and replacing all items outside of the render window with appropriately sized blank space. The window adapts to scrolling behavior, and items are rendered incrementally with low-pri (after any running interactions) if they are far from the visible area, or with hi-pri otherwise to minimize the potential of seeing blank space.</p>
<p>Some caveats:</p>
<ul>
docs/0.12/sectionlist.html
+1 -1
View File
@@ -12,7 +12,7 @@
<li>Scroll loading.</li>
</ul>
<p>If you don't need section support and want a simpler interface, use
<a href="/react-native/flatlist.md"><code>&lt;FlatList&gt;</code></a>.</p>
<a href="/react-native/docs/0.12/flatlist.html"><code>&lt;FlatList&gt;</code></a>.</p>
<p>Simple Examples:</p>
<pre><code class="hljs css javascript">&lt;SectionList
renderItem={({item}) =&gt; &lt;ListItem title={item} /&gt;}
docs/0.12/virtualizedlist.html
+1 -1
View File
@@ -1,4 +1,4 @@
<html><head><meta charset="utf-8"/><meta http-equiv="X-UA-Compatible" content="IE=edge, chrome=1"/><title>VirtualizedList · React Native</title><meta name="viewport" content="width=device-width"/><meta name="generator" content="Docusaurus"/><meta property="og:title" content="VirtualizedList · React Native"/><meta property="og:type" content="website"/><meta property="og:url" content="https://facebook.github.io/react-native/index.html"/><meta property="og:description" content="Base implementation for the more convenient [`&lt;FlatList&gt;`](/react-native/flatlist.md) and [`&lt;SectionList&gt;`](/react-native/sectionlist.md) components, which are also better documented. In general, this should only really be used if you need more flexibility than `FlatList` provides, e.g. for use with immutable data instead of plain arrays."/><link rel="shortcut icon" href="/react-native/img/favicon.png"/><link rel="stylesheet" href="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.css"/><link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/solarized-dark.min.css"/><link rel="alternate" type="application/atom+xml" href="https://facebook.github.io/blog/atom.xml" title="React Native Blog ATOM Feed"/><link rel="alternate" type="application/rss+xml" href="https://facebook.github.io/blog/feed.xml" title="React Native Blog RSS Feed"/><script type="text/javascript" src="https://snack.expo.io/embed.js"></script><script type="text/javascript" src="/react-native/js/codeblocks.js"></script><link rel="stylesheet" href="/react-native/css/main.css"/></head><body class="sideNavVisible"><div class="fixedHeaderContainer"><div class="headerWrapper wrapper"><header><a href="/react-native/"><img class="logo" src="/react-native/img/header_logo.png"/><h2 class="headerTitle">React Native</h2></a><a href="/react-native/versions.html"><h3>0.12</h3></a><div class="navigationWrapper navigationSlider"><nav class="slidingNav"><ul class="nav-site nav-site-internal"><li><a href="/react-native/docs/0.12/getting-started.html" target="_self">Docs</a></li><li><a href="/react-native/en/help.html" target="_self">Community</a></li><li><a href="/react-native/blog" target="_self">Blog</a></li><li class="navSearchWrapper reactNavSearchWrapper"><input type="text" id="search_input_react" placeholder="Search"/></li><li><a href="https://github.com/facebook/react-native" target="_self">GitHub</a></li><li><a href="https://reactjs.org/" target="_self">React</a></li></ul></nav></div></header></div></div><div class="navPusher"><div class="docMainWrapper wrapper"><div class="container mainContainer"><div class="wrapper"><div class="post"><header class="postHeader"><a class="edit-page-link button" href="https://github.com/facebook/react-native-website/blob/master/website/versioned_docs/version-0.5/virtualizedlist.md" target="_blank">Edit</a><h1>VirtualizedList</h1></header><article><div><span><p>Base implementation for the more convenient <a href="/react-native/flatlist.md"><code>&lt;FlatList&gt;</code></a> and <a href="/react-native/sectionlist.md"><code>&lt;SectionList&gt;</code></a> components, which are also better documented. In general, this should only really be used if you need more flexibility than <code>FlatList</code> provides, e.g. for use with immutable data instead of plain arrays.</p>
<html><head><meta charset="utf-8"/><meta http-equiv="X-UA-Compatible" content="IE=edge, chrome=1"/><title>VirtualizedList · React Native</title><meta name="viewport" content="width=device-width"/><meta name="generator" content="Docusaurus"/><meta property="og:title" content="VirtualizedList · React Native"/><meta property="og:type" content="website"/><meta property="og:url" content="https://facebook.github.io/react-native/index.html"/><meta property="og:description" content="Base implementation for the more convenient [`&lt;FlatList&gt;`](/react-native/docs/0.12/flatlist.html) and [`&lt;SectionList&gt;`](/react-native/docs/0.12/sectionlist.html) components, which are also better documented. In general, this should only really be used if you need more flexibility than `FlatList` provides, e.g. for use with immutable data instead of plain arrays."/><link rel="shortcut icon" href="/react-native/img/favicon.png"/><link rel="stylesheet" href="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.css"/><link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/solarized-dark.min.css"/><link rel="alternate" type="application/atom+xml" href="https://facebook.github.io/blog/atom.xml" title="React Native Blog ATOM Feed"/><link rel="alternate" type="application/rss+xml" href="https://facebook.github.io/blog/feed.xml" title="React Native Blog RSS Feed"/><script type="text/javascript" src="https://snack.expo.io/embed.js"></script><script type="text/javascript" src="/react-native/js/codeblocks.js"></script><link rel="stylesheet" href="/react-native/css/main.css"/></head><body class="sideNavVisible"><div class="fixedHeaderContainer"><div class="headerWrapper wrapper"><header><a href="/react-native/"><img class="logo" src="/react-native/img/header_logo.png"/><h2 class="headerTitle">React Native</h2></a><a href="/react-native/versions.html"><h3>0.12</h3></a><div class="navigationWrapper navigationSlider"><nav class="slidingNav"><ul class="nav-site nav-site-internal"><li><a href="/react-native/docs/0.12/getting-started.html" target="_self">Docs</a></li><li><a href="/react-native/en/help.html" target="_self">Community</a></li><li><a href="/react-native/blog" target="_self">Blog</a></li><li class="navSearchWrapper reactNavSearchWrapper"><input type="text" id="search_input_react" placeholder="Search"/></li><li><a href="https://github.com/facebook/react-native" target="_self">GitHub</a></li><li><a href="https://reactjs.org/" target="_self">React</a></li></ul></nav></div></header></div></div><div class="navPusher"><div class="docMainWrapper wrapper"><div class="container mainContainer"><div class="wrapper"><div class="post"><header class="postHeader"><a class="edit-page-link button" href="https://github.com/facebook/react-native-website/blob/master/website/versioned_docs/version-0.5/virtualizedlist.md" target="_blank">Edit</a><h1>VirtualizedList</h1></header><article><div><span><p>Base implementation for the more convenient <a href="/react-native/docs/0.12/flatlist.html"><code>&lt;FlatList&gt;</code></a> and <a href="/react-native/docs/0.12/sectionlist.html"><code>&lt;SectionList&gt;</code></a> components, which are also better documented. In general, this should only really be used if you need more flexibility than <code>FlatList</code> provides, e.g. for use with immutable data instead of plain arrays.</p>
<p>Virtualization massively improves memory consumption and performance of large lists by maintaining a finite render window of active items and replacing all items outside of the render window with appropriately sized blank space. The window adapts to scrolling behavior, and items are rendered incrementally with low-pri (after any running interactions) if they are far from the visible area, or with hi-pri otherwise to minimize the potential of seeing blank space.</p>
<p>Some caveats:</p>
<ul>
docs/0.13/sectionlist.html
+1 -1
View File
@@ -12,7 +12,7 @@
<li>Scroll loading.</li>
</ul>
<p>If you don't need section support and want a simpler interface, use
<a href="/react-native/flatlist.md"><code>&lt;FlatList&gt;</code></a>.</p>
<a href="/react-native/docs/0.13/flatlist.html"><code>&lt;FlatList&gt;</code></a>.</p>
<p>Simple Examples:</p>
<pre><code class="hljs css javascript">&lt;SectionList
renderItem={({item}) =&gt; &lt;ListItem title={item} /&gt;}
docs/0.13/virtualizedlist.html
+1 -1
View File
@@ -1,4 +1,4 @@
<html><head><meta charset="utf-8"/><meta http-equiv="X-UA-Compatible" content="IE=edge, chrome=1"/><title>VirtualizedList · React Native</title><meta name="viewport" content="width=device-width"/><meta name="generator" content="Docusaurus"/><meta property="og:title" content="VirtualizedList · React Native"/><meta property="og:type" content="website"/><meta property="og:url" content="https://facebook.github.io/react-native/index.html"/><meta property="og:description" content="Base implementation for the more convenient [`&lt;FlatList&gt;`](/react-native/flatlist.md) and [`&lt;SectionList&gt;`](/react-native/sectionlist.md) components, which are also better documented. In general, this should only really be used if you need more flexibility than `FlatList` provides, e.g. for use with immutable data instead of plain arrays."/><link rel="shortcut icon" href="/react-native/img/favicon.png"/><link rel="stylesheet" href="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.css"/><link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/solarized-dark.min.css"/><link rel="alternate" type="application/atom+xml" href="https://facebook.github.io/blog/atom.xml" title="React Native Blog ATOM Feed"/><link rel="alternate" type="application/rss+xml" href="https://facebook.github.io/blog/feed.xml" title="React Native Blog RSS Feed"/><script type="text/javascript" src="https://snack.expo.io/embed.js"></script><script type="text/javascript" src="/react-native/js/codeblocks.js"></script><link rel="stylesheet" href="/react-native/css/main.css"/></head><body class="sideNavVisible"><div class="fixedHeaderContainer"><div class="headerWrapper wrapper"><header><a href="/react-native/"><img class="logo" src="/react-native/img/header_logo.png"/><h2 class="headerTitle">React Native</h2></a><a href="/react-native/versions.html"><h3>0.13</h3></a><div class="navigationWrapper navigationSlider"><nav class="slidingNav"><ul class="nav-site nav-site-internal"><li><a href="/react-native/docs/0.13/getting-started.html" target="_self">Docs</a></li><li><a href="/react-native/en/help.html" target="_self">Community</a></li><li><a href="/react-native/blog" target="_self">Blog</a></li><li class="navSearchWrapper reactNavSearchWrapper"><input type="text" id="search_input_react" placeholder="Search"/></li><li><a href="https://github.com/facebook/react-native" target="_self">GitHub</a></li><li><a href="https://reactjs.org/" target="_self">React</a></li></ul></nav></div></header></div></div><div class="navPusher"><div class="docMainWrapper wrapper"><div class="container mainContainer"><div class="wrapper"><div class="post"><header class="postHeader"><a class="edit-page-link button" href="https://github.com/facebook/react-native-website/blob/master/website/versioned_docs/version-0.5/virtualizedlist.md" target="_blank">Edit</a><h1>VirtualizedList</h1></header><article><div><span><p>Base implementation for the more convenient <a href="/react-native/flatlist.md"><code>&lt;FlatList&gt;</code></a> and <a href="/react-native/sectionlist.md"><code>&lt;SectionList&gt;</code></a> components, which are also better documented. In general, this should only really be used if you need more flexibility than <code>FlatList</code> provides, e.g. for use with immutable data instead of plain arrays.</p>
<html><head><meta charset="utf-8"/><meta http-equiv="X-UA-Compatible" content="IE=edge, chrome=1"/><title>VirtualizedList · React Native</title><meta name="viewport" content="width=device-width"/><meta name="generator" content="Docusaurus"/><meta property="og:title" content="VirtualizedList · React Native"/><meta property="og:type" content="website"/><meta property="og:url" content="https://facebook.github.io/react-native/index.html"/><meta property="og:description" content="Base implementation for the more convenient [`&lt;FlatList&gt;`](/react-native/docs/0.13/flatlist.html) and [`&lt;SectionList&gt;`](/react-native/docs/0.13/sectionlist.html) components, which are also better documented. In general, this should only really be used if you need more flexibility than `FlatList` provides, e.g. for use with immutable data instead of plain arrays."/><link rel="shortcut icon" href="/react-native/img/favicon.png"/><link rel="stylesheet" href="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.css"/><link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/solarized-dark.min.css"/><link rel="alternate" type="application/atom+xml" href="https://facebook.github.io/blog/atom.xml" title="React Native Blog ATOM Feed"/><link rel="alternate" type="application/rss+xml" href="https://facebook.github.io/blog/feed.xml" title="React Native Blog RSS Feed"/><script type="text/javascript" src="https://snack.expo.io/embed.js"></script><script type="text/javascript" src="/react-native/js/codeblocks.js"></script><link rel="stylesheet" href="/react-native/css/main.css"/></head><body class="sideNavVisible"><div class="fixedHeaderContainer"><div class="headerWrapper wrapper"><header><a href="/react-native/"><img class="logo" src="/react-native/img/header_logo.png"/><h2 class="headerTitle">React Native</h2></a><a href="/react-native/versions.html"><h3>0.13</h3></a><div class="navigationWrapper navigationSlider"><nav class="slidingNav"><ul class="nav-site nav-site-internal"><li><a href="/react-native/docs/0.13/getting-started.html" target="_self">Docs</a></li><li><a href="/react-native/en/help.html" target="_self">Community</a></li><li><a href="/react-native/blog" target="_self">Blog</a></li><li class="navSearchWrapper reactNavSearchWrapper"><input type="text" id="search_input_react" placeholder="Search"/></li><li><a href="https://github.com/facebook/react-native" target="_self">GitHub</a></li><li><a href="https://reactjs.org/" target="_self">React</a></li></ul></nav></div></header></div></div><div class="navPusher"><div class="docMainWrapper wrapper"><div class="container mainContainer"><div class="wrapper"><div class="post"><header class="postHeader"><a class="edit-page-link button" href="https://github.com/facebook/react-native-website/blob/master/website/versioned_docs/version-0.5/virtualizedlist.md" target="_blank">Edit</a><h1>VirtualizedList</h1></header><article><div><span><p>Base implementation for the more convenient <a href="/react-native/docs/0.13/flatlist.html"><code>&lt;FlatList&gt;</code></a> and <a href="/react-native/docs/0.13/sectionlist.html"><code>&lt;SectionList&gt;</code></a> components, which are also better documented. In general, this should only really be used if you need more flexibility than <code>FlatList</code> provides, e.g. for use with immutable data instead of plain arrays.</p>
<p>Virtualization massively improves memory consumption and performance of large lists by maintaining a finite render window of active items and replacing all items outside of the render window with appropriately sized blank space. The window adapts to scrolling behavior, and items are rendered incrementally with low-pri (after any running interactions) if they are far from the visible area, or with hi-pri otherwise to minimize the potential of seeing blank space.</p>
<p>Some caveats:</p>
<ul>
docs/0.14/sectionlist.html
+1 -1
View File
@@ -12,7 +12,7 @@
<li>Scroll loading.</li>
</ul>
<p>If you don't need section support and want a simpler interface, use
<a href="/react-native/flatlist.md"><code>&lt;FlatList&gt;</code></a>.</p>
<a href="/react-native/docs/0.14/flatlist.html"><code>&lt;FlatList&gt;</code></a>.</p>
<p>Simple Examples:</p>
<pre><code class="hljs css javascript">&lt;SectionList
renderItem={({item}) =&gt; &lt;ListItem title={item} /&gt;}
docs/0.14/virtualizedlist.html
+1 -1
View File
@@ -1,4 +1,4 @@
<html><head><meta charset="utf-8"/><meta http-equiv="X-UA-Compatible" content="IE=edge, chrome=1"/><title>VirtualizedList · React Native</title><meta name="viewport" content="width=device-width"/><meta name="generator" content="Docusaurus"/><meta property="og:title" content="VirtualizedList · React Native"/><meta property="og:type" content="website"/><meta property="og:url" content="https://facebook.github.io/react-native/index.html"/><meta property="og:description" content="Base implementation for the more convenient [`&lt;FlatList&gt;`](/react-native/flatlist.md) and [`&lt;SectionList&gt;`](/react-native/sectionlist.md) components, which are also better documented. In general, this should only really be used if you need more flexibility than `FlatList` provides, e.g. for use with immutable data instead of plain arrays."/><link rel="shortcut icon" href="/react-native/img/favicon.png"/><link rel="stylesheet" href="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.css"/><link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/solarized-dark.min.css"/><link rel="alternate" type="application/atom+xml" href="https://facebook.github.io/blog/atom.xml" title="React Native Blog ATOM Feed"/><link rel="alternate" type="application/rss+xml" href="https://facebook.github.io/blog/feed.xml" title="React Native Blog RSS Feed"/><script type="text/javascript" src="https://snack.expo.io/embed.js"></script><script type="text/javascript" src="/react-native/js/codeblocks.js"></script><link rel="stylesheet" href="/react-native/css/main.css"/></head><body class="sideNavVisible"><div class="fixedHeaderContainer"><div class="headerWrapper wrapper"><header><a href="/react-native/"><img class="logo" src="/react-native/img/header_logo.png"/><h2 class="headerTitle">React Native</h2></a><a href="/react-native/versions.html"><h3>0.14</h3></a><div class="navigationWrapper navigationSlider"><nav class="slidingNav"><ul class="nav-site nav-site-internal"><li><a href="/react-native/docs/0.14/getting-started.html" target="_self">Docs</a></li><li><a href="/react-native/en/help.html" target="_self">Community</a></li><li><a href="/react-native/blog" target="_self">Blog</a></li><li class="navSearchWrapper reactNavSearchWrapper"><input type="text" id="search_input_react" placeholder="Search"/></li><li><a href="https://github.com/facebook/react-native" target="_self">GitHub</a></li><li><a href="https://reactjs.org/" target="_self">React</a></li></ul></nav></div></header></div></div><div class="navPusher"><div class="docMainWrapper wrapper"><div class="container mainContainer"><div class="wrapper"><div class="post"><header class="postHeader"><a class="edit-page-link button" href="https://github.com/facebook/react-native-website/blob/master/website/versioned_docs/version-0.5/virtualizedlist.md" target="_blank">Edit</a><h1>VirtualizedList</h1></header><article><div><span><p>Base implementation for the more convenient <a href="/react-native/flatlist.md"><code>&lt;FlatList&gt;</code></a> and <a href="/react-native/sectionlist.md"><code>&lt;SectionList&gt;</code></a> components, which are also better documented. In general, this should only really be used if you need more flexibility than <code>FlatList</code> provides, e.g. for use with immutable data instead of plain arrays.</p>
<html><head><meta charset="utf-8"/><meta http-equiv="X-UA-Compatible" content="IE=edge, chrome=1"/><title>VirtualizedList · React Native</title><meta name="viewport" content="width=device-width"/><meta name="generator" content="Docusaurus"/><meta property="og:title" content="VirtualizedList · React Native"/><meta property="og:type" content="website"/><meta property="og:url" content="https://facebook.github.io/react-native/index.html"/><meta property="og:description" content="Base implementation for the more convenient [`&lt;FlatList&gt;`](/react-native/docs/0.14/flatlist.html) and [`&lt;SectionList&gt;`](/react-native/docs/0.14/sectionlist.html) components, which are also better documented. In general, this should only really be used if you need more flexibility than `FlatList` provides, e.g. for use with immutable data instead of plain arrays."/><link rel="shortcut icon" href="/react-native/img/favicon.png"/><link rel="stylesheet" href="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.css"/><link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/solarized-dark.min.css"/><link rel="alternate" type="application/atom+xml" href="https://facebook.github.io/blog/atom.xml" title="React Native Blog ATOM Feed"/><link rel="alternate" type="application/rss+xml" href="https://facebook.github.io/blog/feed.xml" title="React Native Blog RSS Feed"/><script type="text/javascript" src="https://snack.expo.io/embed.js"></script><script type="text/javascript" src="/react-native/js/codeblocks.js"></script><link rel="stylesheet" href="/react-native/css/main.css"/></head><body class="sideNavVisible"><div class="fixedHeaderContainer"><div class="headerWrapper wrapper"><header><a href="/react-native/"><img class="logo" src="/react-native/img/header_logo.png"/><h2 class="headerTitle">React Native</h2></a><a href="/react-native/versions.html"><h3>0.14</h3></a><div class="navigationWrapper navigationSlider"><nav class="slidingNav"><ul class="nav-site nav-site-internal"><li><a href="/react-native/docs/0.14/getting-started.html" target="_self">Docs</a></li><li><a href="/react-native/en/help.html" target="_self">Community</a></li><li><a href="/react-native/blog" target="_self">Blog</a></li><li class="navSearchWrapper reactNavSearchWrapper"><input type="text" id="search_input_react" placeholder="Search"/></li><li><a href="https://github.com/facebook/react-native" target="_self">GitHub</a></li><li><a href="https://reactjs.org/" target="_self">React</a></li></ul></nav></div></header></div></div><div class="navPusher"><div class="docMainWrapper wrapper"><div class="container mainContainer"><div class="wrapper"><div class="post"><header class="postHeader"><a class="edit-page-link button" href="https://github.com/facebook/react-native-website/blob/master/website/versioned_docs/version-0.5/virtualizedlist.md" target="_blank">Edit</a><h1>VirtualizedList</h1></header><article><div><span><p>Base implementation for the more convenient <a href="/react-native/docs/0.14/flatlist.html"><code>&lt;FlatList&gt;</code></a> and <a href="/react-native/docs/0.14/sectionlist.html"><code>&lt;SectionList&gt;</code></a> components, which are also better documented. In general, this should only really be used if you need more flexibility than <code>FlatList</code> provides, e.g. for use with immutable data instead of plain arrays.</p>
<p>Virtualization massively improves memory consumption and performance of large lists by maintaining a finite render window of active items and replacing all items outside of the render window with appropriately sized blank space. The window adapts to scrolling behavior, and items are rendered incrementally with low-pri (after any running interactions) if they are far from the visible area, or with hi-pri otherwise to minimize the potential of seeing blank space.</p>
<p>Some caveats:</p>
<ul>
docs/0.15/sectionlist.html
+1 -1
View File
@@ -12,7 +12,7 @@
<li>Scroll loading.</li>
</ul>
<p>If you don't need section support and want a simpler interface, use
<a href="/react-native/flatlist.md"><code>&lt;FlatList&gt;</code></a>.</p>
<a href="/react-native/docs/0.15/flatlist.html"><code>&lt;FlatList&gt;</code></a>.</p>
<p>Simple Examples:</p>
<pre><code class="hljs css javascript">&lt;SectionList
renderItem={({item}) =&gt; &lt;ListItem title={item} /&gt;}
docs/0.15/virtualizedlist.html
+1 -1
View File
@@ -1,4 +1,4 @@
<html><head><meta charset="utf-8"/><meta http-equiv="X-UA-Compatible" content="IE=edge, chrome=1"/><title>VirtualizedList · React Native</title><meta name="viewport" content="width=device-width"/><meta name="generator" content="Docusaurus"/><meta property="og:title" content="VirtualizedList · React Native"/><meta property="og:type" content="website"/><meta property="og:url" content="https://facebook.github.io/react-native/index.html"/><meta property="og:description" content="Base implementation for the more convenient [`&lt;FlatList&gt;`](/react-native/flatlist.md) and [`&lt;SectionList&gt;`](/react-native/sectionlist.md) components, which are also better documented. In general, this should only really be used if you need more flexibility than `FlatList` provides, e.g. for use with immutable data instead of plain arrays."/><link rel="shortcut icon" href="/react-native/img/favicon.png"/><link rel="stylesheet" href="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.css"/><link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/solarized-dark.min.css"/><link rel="alternate" type="application/atom+xml" href="https://facebook.github.io/blog/atom.xml" title="React Native Blog ATOM Feed"/><link rel="alternate" type="application/rss+xml" href="https://facebook.github.io/blog/feed.xml" title="React Native Blog RSS Feed"/><script type="text/javascript" src="https://snack.expo.io/embed.js"></script><script type="text/javascript" src="/react-native/js/codeblocks.js"></script><link rel="stylesheet" href="/react-native/css/main.css"/></head><body class="sideNavVisible"><div class="fixedHeaderContainer"><div class="headerWrapper wrapper"><header><a href="/react-native/"><img class="logo" src="/react-native/img/header_logo.png"/><h2 class="headerTitle">React Native</h2></a><a href="/react-native/versions.html"><h3>0.15</h3></a><div class="navigationWrapper navigationSlider"><nav class="slidingNav"><ul class="nav-site nav-site-internal"><li><a href="/react-native/docs/0.15/getting-started.html" target="_self">Docs</a></li><li><a href="/react-native/en/help.html" target="_self">Community</a></li><li><a href="/react-native/blog" target="_self">Blog</a></li><li class="navSearchWrapper reactNavSearchWrapper"><input type="text" id="search_input_react" placeholder="Search"/></li><li><a href="https://github.com/facebook/react-native" target="_self">GitHub</a></li><li><a href="https://reactjs.org/" target="_self">React</a></li></ul></nav></div></header></div></div><div class="navPusher"><div class="docMainWrapper wrapper"><div class="container mainContainer"><div class="wrapper"><div class="post"><header class="postHeader"><a class="edit-page-link button" href="https://github.com/facebook/react-native-website/blob/master/website/versioned_docs/version-0.5/virtualizedlist.md" target="_blank">Edit</a><h1>VirtualizedList</h1></header><article><div><span><p>Base implementation for the more convenient <a href="/react-native/flatlist.md"><code>&lt;FlatList&gt;</code></a> and <a href="/react-native/sectionlist.md"><code>&lt;SectionList&gt;</code></a> components, which are also better documented. In general, this should only really be used if you need more flexibility than <code>FlatList</code> provides, e.g. for use with immutable data instead of plain arrays.</p>
<html><head><meta charset="utf-8"/><meta http-equiv="X-UA-Compatible" content="IE=edge, chrome=1"/><title>VirtualizedList · React Native</title><meta name="viewport" content="width=device-width"/><meta name="generator" content="Docusaurus"/><meta property="og:title" content="VirtualizedList · React Native"/><meta property="og:type" content="website"/><meta property="og:url" content="https://facebook.github.io/react-native/index.html"/><meta property="og:description" content="Base implementation for the more convenient [`&lt;FlatList&gt;`](/react-native/docs/0.15/flatlist.html) and [`&lt;SectionList&gt;`](/react-native/docs/0.15/sectionlist.html) components, which are also better documented. In general, this should only really be used if you need more flexibility than `FlatList` provides, e.g. for use with immutable data instead of plain arrays."/><link rel="shortcut icon" href="/react-native/img/favicon.png"/><link rel="stylesheet" href="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.css"/><link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/solarized-dark.min.css"/><link rel="alternate" type="application/atom+xml" href="https://facebook.github.io/blog/atom.xml" title="React Native Blog ATOM Feed"/><link rel="alternate" type="application/rss+xml" href="https://facebook.github.io/blog/feed.xml" title="React Native Blog RSS Feed"/><script type="text/javascript" src="https://snack.expo.io/embed.js"></script><script type="text/javascript" src="/react-native/js/codeblocks.js"></script><link rel="stylesheet" href="/react-native/css/main.css"/></head><body class="sideNavVisible"><div class="fixedHeaderContainer"><div class="headerWrapper wrapper"><header><a href="/react-native/"><img class="logo" src="/react-native/img/header_logo.png"/><h2 class="headerTitle">React Native</h2></a><a href="/react-native/versions.html"><h3>0.15</h3></a><div class="navigationWrapper navigationSlider"><nav class="slidingNav"><ul class="nav-site nav-site-internal"><li><a href="/react-native/docs/0.15/getting-started.html" target="_self">Docs</a></li><li><a href="/react-native/en/help.html" target="_self">Community</a></li><li><a href="/react-native/blog" target="_self">Blog</a></li><li class="navSearchWrapper reactNavSearchWrapper"><input type="text" id="search_input_react" placeholder="Search"/></li><li><a href="https://github.com/facebook/react-native" target="_self">GitHub</a></li><li><a href="https://reactjs.org/" target="_self">React</a></li></ul></nav></div></header></div></div><div class="navPusher"><div class="docMainWrapper wrapper"><div class="container mainContainer"><div class="wrapper"><div class="post"><header class="postHeader"><a class="edit-page-link button" href="https://github.com/facebook/react-native-website/blob/master/website/versioned_docs/version-0.5/virtualizedlist.md" target="_blank">Edit</a><h1>VirtualizedList</h1></header><article><div><span><p>Base implementation for the more convenient <a href="/react-native/docs/0.15/flatlist.html"><code>&lt;FlatList&gt;</code></a> and <a href="/react-native/docs/0.15/sectionlist.html"><code>&lt;SectionList&gt;</code></a> components, which are also better documented. In general, this should only really be used if you need more flexibility than <code>FlatList</code> provides, e.g. for use with immutable data instead of plain arrays.</p>
<p>Virtualization massively improves memory consumption and performance of large lists by maintaining a finite render window of active items and replacing all items outside of the render window with appropriately sized blank space. The window adapts to scrolling behavior, and items are rendered incrementally with low-pri (after any running interactions) if they are far from the visible area, or with hi-pri otherwise to minimize the potential of seeing blank space.</p>
<p>Some caveats:</p>
<ul>
docs/0.16/sectionlist.html
+1 -1
View File
@@ -12,7 +12,7 @@
<li>Scroll loading.</li>
</ul>
<p>If you don't need section support and want a simpler interface, use
<a href="/react-native/flatlist.md"><code>&lt;FlatList&gt;</code></a>.</p>
<a href="/react-native/docs/0.16/flatlist.html"><code>&lt;FlatList&gt;</code></a>.</p>
<p>Simple Examples:</p>
<pre><code class="hljs css javascript">&lt;SectionList
renderItem={({item}) =&gt; &lt;ListItem title={item} /&gt;}
docs/0.16/virtualizedlist.html
+1 -1
View File
@@ -1,4 +1,4 @@
<html><head><meta charset="utf-8"/><meta http-equiv="X-UA-Compatible" content="IE=edge, chrome=1"/><title>VirtualizedList · React Native</title><meta name="viewport" content="width=device-width"/><meta name="generator" content="Docusaurus"/><meta property="og:title" content="VirtualizedList · React Native"/><meta property="og:type" content="website"/><meta property="og:url" content="https://facebook.github.io/react-native/index.html"/><meta property="og:description" content="Base implementation for the more convenient [`&lt;FlatList&gt;`](/react-native/flatlist.md) and [`&lt;SectionList&gt;`](/react-native/sectionlist.md) components, which are also better documented. In general, this should only really be used if you need more flexibility than `FlatList` provides, e.g. for use with immutable data instead of plain arrays."/><link rel="shortcut icon" href="/react-native/img/favicon.png"/><link rel="stylesheet" href="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.css"/><link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/solarized-dark.min.css"/><link rel="alternate" type="application/atom+xml" href="https://facebook.github.io/blog/atom.xml" title="React Native Blog ATOM Feed"/><link rel="alternate" type="application/rss+xml" href="https://facebook.github.io/blog/feed.xml" title="React Native Blog RSS Feed"/><script type="text/javascript" src="https://snack.expo.io/embed.js"></script><script type="text/javascript" src="/react-native/js/codeblocks.js"></script><link rel="stylesheet" href="/react-native/css/main.css"/></head><body class="sideNavVisible"><div class="fixedHeaderContainer"><div class="headerWrapper wrapper"><header><a href="/react-native/"><img class="logo" src="/react-native/img/header_logo.png"/><h2 class="headerTitle">React Native</h2></a><a href="/react-native/versions.html"><h3>0.16</h3></a><div class="navigationWrapper navigationSlider"><nav class="slidingNav"><ul class="nav-site nav-site-internal"><li><a href="/react-native/docs/0.16/getting-started.html" target="_self">Docs</a></li><li><a href="/react-native/en/help.html" target="_self">Community</a></li><li><a href="/react-native/blog" target="_self">Blog</a></li><li class="navSearchWrapper reactNavSearchWrapper"><input type="text" id="search_input_react" placeholder="Search"/></li><li><a href="https://github.com/facebook/react-native" target="_self">GitHub</a></li><li><a href="https://reactjs.org/" target="_self">React</a></li></ul></nav></div></header></div></div><div class="navPusher"><div class="docMainWrapper wrapper"><div class="container mainContainer"><div class="wrapper"><div class="post"><header class="postHeader"><a class="edit-page-link button" href="https://github.com/facebook/react-native-website/blob/master/website/versioned_docs/version-0.5/virtualizedlist.md" target="_blank">Edit</a><h1>VirtualizedList</h1></header><article><div><span><p>Base implementation for the more convenient <a href="/react-native/flatlist.md"><code>&lt;FlatList&gt;</code></a> and <a href="/react-native/sectionlist.md"><code>&lt;SectionList&gt;</code></a> components, which are also better documented. In general, this should only really be used if you need more flexibility than <code>FlatList</code> provides, e.g. for use with immutable data instead of plain arrays.</p>
<html><head><meta charset="utf-8"/><meta http-equiv="X-UA-Compatible" content="IE=edge, chrome=1"/><title>VirtualizedList · React Native</title><meta name="viewport" content="width=device-width"/><meta name="generator" content="Docusaurus"/><meta property="og:title" content="VirtualizedList · React Native"/><meta property="og:type" content="website"/><meta property="og:url" content="https://facebook.github.io/react-native/index.html"/><meta property="og:description" content="Base implementation for the more convenient [`&lt;FlatList&gt;`](/react-native/docs/0.16/flatlist.html) and [`&lt;SectionList&gt;`](/react-native/docs/0.16/sectionlist.html) components, which are also better documented. In general, this should only really be used if you need more flexibility than `FlatList` provides, e.g. for use with immutable data instead of plain arrays."/><link rel="shortcut icon" href="/react-native/img/favicon.png"/><link rel="stylesheet" href="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.css"/><link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/solarized-dark.min.css"/><link rel="alternate" type="application/atom+xml" href="https://facebook.github.io/blog/atom.xml" title="React Native Blog ATOM Feed"/><link rel="alternate" type="application/rss+xml" href="https://facebook.github.io/blog/feed.xml" title="React Native Blog RSS Feed"/><script type="text/javascript" src="https://snack.expo.io/embed.js"></script><script type="text/javascript" src="/react-native/js/codeblocks.js"></script><link rel="stylesheet" href="/react-native/css/main.css"/></head><body class="sideNavVisible"><div class="fixedHeaderContainer"><div class="headerWrapper wrapper"><header><a href="/react-native/"><img class="logo" src="/react-native/img/header_logo.png"/><h2 class="headerTitle">React Native</h2></a><a href="/react-native/versions.html"><h3>0.16</h3></a><div class="navigationWrapper navigationSlider"><nav class="slidingNav"><ul class="nav-site nav-site-internal"><li><a href="/react-native/docs/0.16/getting-started.html" target="_self">Docs</a></li><li><a href="/react-native/en/help.html" target="_self">Community</a></li><li><a href="/react-native/blog" target="_self">Blog</a></li><li class="navSearchWrapper reactNavSearchWrapper"><input type="text" id="search_input_react" placeholder="Search"/></li><li><a href="https://github.com/facebook/react-native" target="_self">GitHub</a></li><li><a href="https://reactjs.org/" target="_self">React</a></li></ul></nav></div></header></div></div><div class="navPusher"><div class="docMainWrapper wrapper"><div class="container mainContainer"><div class="wrapper"><div class="post"><header class="postHeader"><a class="edit-page-link button" href="https://github.com/facebook/react-native-website/blob/master/website/versioned_docs/version-0.5/virtualizedlist.md" target="_blank">Edit</a><h1>VirtualizedList</h1></header><article><div><span><p>Base implementation for the more convenient <a href="/react-native/docs/0.16/flatlist.html"><code>&lt;FlatList&gt;</code></a> and <a href="/react-native/docs/0.16/sectionlist.html"><code>&lt;SectionList&gt;</code></a> components, which are also better documented. In general, this should only really be used if you need more flexibility than <code>FlatList</code> provides, e.g. for use with immutable data instead of plain arrays.</p>
<p>Virtualization massively improves memory consumption and performance of large lists by maintaining a finite render window of active items and replacing all items outside of the render window with appropriately sized blank space. The window adapts to scrolling behavior, and items are rendered incrementally with low-pri (after any running interactions) if they are far from the visible area, or with hi-pri otherwise to minimize the potential of seeing blank space.</p>
<p>Some caveats:</p>
<ul>
docs/0.17/sectionlist.html
+1 -1
View File
@@ -12,7 +12,7 @@
<li>Scroll loading.</li>
</ul>
<p>If you don't need section support and want a simpler interface, use
<a href="/react-native/flatlist.md"><code>&lt;FlatList&gt;</code></a>.</p>
<a href="/react-native/docs/0.17/flatlist.html"><code>&lt;FlatList&gt;</code></a>.</p>
<p>Simple Examples:</p>
<pre><code class="hljs css javascript">&lt;SectionList
renderItem={({item}) =&gt; &lt;ListItem title={item} /&gt;}
docs/0.17/virtualizedlist.html
+1 -1
View File
@@ -1,4 +1,4 @@
<html><head><meta charset="utf-8"/><meta http-equiv="X-UA-Compatible" content="IE=edge, chrome=1"/><title>VirtualizedList · React Native</title><meta name="viewport" content="width=device-width"/><meta name="generator" content="Docusaurus"/><meta property="og:title" content="VirtualizedList · React Native"/><meta property="og:type" content="website"/><meta property="og:url" content="https://facebook.github.io/react-native/index.html"/><meta property="og:description" content="Base implementation for the more convenient [`&lt;FlatList&gt;`](/react-native/flatlist.md) and [`&lt;SectionList&gt;`](/react-native/sectionlist.md) components, which are also better documented. In general, this should only really be used if you need more flexibility than `FlatList` provides, e.g. for use with immutable data instead of plain arrays."/><link rel="shortcut icon" href="/react-native/img/favicon.png"/><link rel="stylesheet" href="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.css"/><link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/solarized-dark.min.css"/><link rel="alternate" type="application/atom+xml" href="https://facebook.github.io/blog/atom.xml" title="React Native Blog ATOM Feed"/><link rel="alternate" type="application/rss+xml" href="https://facebook.github.io/blog/feed.xml" title="React Native Blog RSS Feed"/><script type="text/javascript" src="https://snack.expo.io/embed.js"></script><script type="text/javascript" src="/react-native/js/codeblocks.js"></script><link rel="stylesheet" href="/react-native/css/main.css"/></head><body class="sideNavVisible"><div class="fixedHeaderContainer"><div class="headerWrapper wrapper"><header><a href="/react-native/"><img class="logo" src="/react-native/img/header_logo.png"/><h2 class="headerTitle">React Native</h2></a><a href="/react-native/versions.html"><h3>0.17</h3></a><div class="navigationWrapper navigationSlider"><nav class="slidingNav"><ul class="nav-site nav-site-internal"><li><a href="/react-native/docs/0.17/getting-started.html" target="_self">Docs</a></li><li><a href="/react-native/en/help.html" target="_self">Community</a></li><li><a href="/react-native/blog" target="_self">Blog</a></li><li class="navSearchWrapper reactNavSearchWrapper"><input type="text" id="search_input_react" placeholder="Search"/></li><li><a href="https://github.com/facebook/react-native" target="_self">GitHub</a></li><li><a href="https://reactjs.org/" target="_self">React</a></li></ul></nav></div></header></div></div><div class="navPusher"><div class="docMainWrapper wrapper"><div class="container mainContainer"><div class="wrapper"><div class="post"><header class="postHeader"><a class="edit-page-link button" href="https://github.com/facebook/react-native-website/blob/master/website/versioned_docs/version-0.5/virtualizedlist.md" target="_blank">Edit</a><h1>VirtualizedList</h1></header><article><div><span><p>Base implementation for the more convenient <a href="/react-native/flatlist.md"><code>&lt;FlatList&gt;</code></a> and <a href="/react-native/sectionlist.md"><code>&lt;SectionList&gt;</code></a> components, which are also better documented. In general, this should only really be used if you need more flexibility than <code>FlatList</code> provides, e.g. for use with immutable data instead of plain arrays.</p>
<html><head><meta charset="utf-8"/><meta http-equiv="X-UA-Compatible" content="IE=edge, chrome=1"/><title>VirtualizedList · React Native</title><meta name="viewport" content="width=device-width"/><meta name="generator" content="Docusaurus"/><meta property="og:title" content="VirtualizedList · React Native"/><meta property="og:type" content="website"/><meta property="og:url" content="https://facebook.github.io/react-native/index.html"/><meta property="og:description" content="Base implementation for the more convenient [`&lt;FlatList&gt;`](/react-native/docs/0.17/flatlist.html) and [`&lt;SectionList&gt;`](/react-native/docs/0.17/sectionlist.html) components, which are also better documented. In general, this should only really be used if you need more flexibility than `FlatList` provides, e.g. for use with immutable data instead of plain arrays."/><link rel="shortcut icon" href="/react-native/img/favicon.png"/><link rel="stylesheet" href="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.css"/><link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/solarized-dark.min.css"/><link rel="alternate" type="application/atom+xml" href="https://facebook.github.io/blog/atom.xml" title="React Native Blog ATOM Feed"/><link rel="alternate" type="application/rss+xml" href="https://facebook.github.io/blog/feed.xml" title="React Native Blog RSS Feed"/><script type="text/javascript" src="https://snack.expo.io/embed.js"></script><script type="text/javascript" src="/react-native/js/codeblocks.js"></script><link rel="stylesheet" href="/react-native/css/main.css"/></head><body class="sideNavVisible"><div class="fixedHeaderContainer"><div class="headerWrapper wrapper"><header><a href="/react-native/"><img class="logo" src="/react-native/img/header_logo.png"/><h2 class="headerTitle">React Native</h2></a><a href="/react-native/versions.html"><h3>0.17</h3></a><div class="navigationWrapper navigationSlider"><nav class="slidingNav"><ul class="nav-site nav-site-internal"><li><a href="/react-native/docs/0.17/getting-started.html" target="_self">Docs</a></li><li><a href="/react-native/en/help.html" target="_self">Community</a></li><li><a href="/react-native/blog" target="_self">Blog</a></li><li class="navSearchWrapper reactNavSearchWrapper"><input type="text" id="search_input_react" placeholder="Search"/></li><li><a href="https://github.com/facebook/react-native" target="_self">GitHub</a></li><li><a href="https://reactjs.org/" target="_self">React</a></li></ul></nav></div></header></div></div><div class="navPusher"><div class="docMainWrapper wrapper"><div class="container mainContainer"><div class="wrapper"><div class="post"><header class="postHeader"><a class="edit-page-link button" href="https://github.com/facebook/react-native-website/blob/master/website/versioned_docs/version-0.5/virtualizedlist.md" target="_blank">Edit</a><h1>VirtualizedList</h1></header><article><div><span><p>Base implementation for the more convenient <a href="/react-native/docs/0.17/flatlist.html"><code>&lt;FlatList&gt;</code></a> and <a href="/react-native/docs/0.17/sectionlist.html"><code>&lt;SectionList&gt;</code></a> components, which are also better documented. In general, this should only really be used if you need more flexibility than <code>FlatList</code> provides, e.g. for use with immutable data instead of plain arrays.</p>
<p>Virtualization massively improves memory consumption and performance of large lists by maintaining a finite render window of active items and replacing all items outside of the render window with appropriately sized blank space. The window adapts to scrolling behavior, and items are rendered incrementally with low-pri (after any running interactions) if they are far from the visible area, or with hi-pri otherwise to minimize the potential of seeing blank space.</p>
<p>Some caveats:</p>
<ul>
docs/0.18/sectionlist.html
+1 -1
View File
@@ -12,7 +12,7 @@
<li>Scroll loading.</li>
</ul>
<p>If you don't need section support and want a simpler interface, use
<a href="/react-native/flatlist.md"><code>&lt;FlatList&gt;</code></a>.</p>
<a href="/react-native/docs/0.18/flatlist.html"><code>&lt;FlatList&gt;</code></a>.</p>
<p>Simple Examples:</p>
<pre><code class="hljs css javascript">&lt;SectionList
renderItem={({item}) =&gt; &lt;ListItem title={item} /&gt;}
docs/0.18/virtualizedlist.html
+1 -1
View File
@@ -1,4 +1,4 @@
<html><head><meta charset="utf-8"/><meta http-equiv="X-UA-Compatible" content="IE=edge, chrome=1"/><title>VirtualizedList · React Native</title><meta name="viewport" content="width=device-width"/><meta name="generator" content="Docusaurus"/><meta property="og:title" content="VirtualizedList · React Native"/><meta property="og:type" content="website"/><meta property="og:url" content="https://facebook.github.io/react-native/index.html"/><meta property="og:description" content="Base implementation for the more convenient [`&lt;FlatList&gt;`](/react-native/flatlist.md) and [`&lt;SectionList&gt;`](/react-native/sectionlist.md) components, which are also better documented. In general, this should only really be used if you need more flexibility than `FlatList` provides, e.g. for use with immutable data instead of plain arrays."/><link rel="shortcut icon" href="/react-native/img/favicon.png"/><link rel="stylesheet" href="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.css"/><link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/solarized-dark.min.css"/><link rel="alternate" type="application/atom+xml" href="https://facebook.github.io/blog/atom.xml" title="React Native Blog ATOM Feed"/><link rel="alternate" type="application/rss+xml" href="https://facebook.github.io/blog/feed.xml" title="React Native Blog RSS Feed"/><script type="text/javascript" src="https://snack.expo.io/embed.js"></script><script type="text/javascript" src="/react-native/js/codeblocks.js"></script><link rel="stylesheet" href="/react-native/css/main.css"/></head><body class="sideNavVisible"><div class="fixedHeaderContainer"><div class="headerWrapper wrapper"><header><a href="/react-native/"><img class="logo" src="/react-native/img/header_logo.png"/><h2 class="headerTitle">React Native</h2></a><a href="/react-native/versions.html"><h3>0.18</h3></a><div class="navigationWrapper navigationSlider"><nav class="slidingNav"><ul class="nav-site nav-site-internal"><li><a href="/react-native/docs/0.18/getting-started.html" target="_self">Docs</a></li><li><a href="/react-native/en/help.html" target="_self">Community</a></li><li><a href="/react-native/blog" target="_self">Blog</a></li><li class="navSearchWrapper reactNavSearchWrapper"><input type="text" id="search_input_react" placeholder="Search"/></li><li><a href="https://github.com/facebook/react-native" target="_self">GitHub</a></li><li><a href="https://reactjs.org/" target="_self">React</a></li></ul></nav></div></header></div></div><div class="navPusher"><div class="docMainWrapper wrapper"><div class="container mainContainer"><div class="wrapper"><div class="post"><header class="postHeader"><a class="edit-page-link button" href="https://github.com/facebook/react-native-website/blob/master/website/versioned_docs/version-0.5/virtualizedlist.md" target="_blank">Edit</a><h1>VirtualizedList</h1></header><article><div><span><p>Base implementation for the more convenient <a href="/react-native/flatlist.md"><code>&lt;FlatList&gt;</code></a> and <a href="/react-native/sectionlist.md"><code>&lt;SectionList&gt;</code></a> components, which are also better documented. In general, this should only really be used if you need more flexibility than <code>FlatList</code> provides, e.g. for use with immutable data instead of plain arrays.</p>
<html><head><meta charset="utf-8"/><meta http-equiv="X-UA-Compatible" content="IE=edge, chrome=1"/><title>VirtualizedList · React Native</title><meta name="viewport" content="width=device-width"/><meta name="generator" content="Docusaurus"/><meta property="og:title" content="VirtualizedList · React Native"/><meta property="og:type" content="website"/><meta property="og:url" content="https://facebook.github.io/react-native/index.html"/><meta property="og:description" content="Base implementation for the more convenient [`&lt;FlatList&gt;`](/react-native/docs/0.18/flatlist.html) and [`&lt;SectionList&gt;`](/react-native/docs/0.18/sectionlist.html) components, which are also better documented. In general, this should only really be used if you need more flexibility than `FlatList` provides, e.g. for use with immutable data instead of plain arrays."/><link rel="shortcut icon" href="/react-native/img/favicon.png"/><link rel="stylesheet" href="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.css"/><link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/solarized-dark.min.css"/><link rel="alternate" type="application/atom+xml" href="https://facebook.github.io/blog/atom.xml" title="React Native Blog ATOM Feed"/><link rel="alternate" type="application/rss+xml" href="https://facebook.github.io/blog/feed.xml" title="React Native Blog RSS Feed"/><script type="text/javascript" src="https://snack.expo.io/embed.js"></script><script type="text/javascript" src="/react-native/js/codeblocks.js"></script><link rel="stylesheet" href="/react-native/css/main.css"/></head><body class="sideNavVisible"><div class="fixedHeaderContainer"><div class="headerWrapper wrapper"><header><a href="/react-native/"><img class="logo" src="/react-native/img/header_logo.png"/><h2 class="headerTitle">React Native</h2></a><a href="/react-native/versions.html"><h3>0.18</h3></a><div class="navigationWrapper navigationSlider"><nav class="slidingNav"><ul class="nav-site nav-site-internal"><li><a href="/react-native/docs/0.18/getting-started.html" target="_self">Docs</a></li><li><a href="/react-native/en/help.html" target="_self">Community</a></li><li><a href="/react-native/blog" target="_self">Blog</a></li><li class="navSearchWrapper reactNavSearchWrapper"><input type="text" id="search_input_react" placeholder="Search"/></li><li><a href="https://github.com/facebook/react-native" target="_self">GitHub</a></li><li><a href="https://reactjs.org/" target="_self">React</a></li></ul></nav></div></header></div></div><div class="navPusher"><div class="docMainWrapper wrapper"><div class="container mainContainer"><div class="wrapper"><div class="post"><header class="postHeader"><a class="edit-page-link button" href="https://github.com/facebook/react-native-website/blob/master/website/versioned_docs/version-0.5/virtualizedlist.md" target="_blank">Edit</a><h1>VirtualizedList</h1></header><article><div><span><p>Base implementation for the more convenient <a href="/react-native/docs/0.18/flatlist.html"><code>&lt;FlatList&gt;</code></a> and <a href="/react-native/docs/0.18/sectionlist.html"><code>&lt;SectionList&gt;</code></a> components, which are also better documented. In general, this should only really be used if you need more flexibility than <code>FlatList</code> provides, e.g. for use with immutable data instead of plain arrays.</p>
<p>Virtualization massively improves memory consumption and performance of large lists by maintaining a finite render window of active items and replacing all items outside of the render window with appropriately sized blank space. The window adapts to scrolling behavior, and items are rendered incrementally with low-pri (after any running interactions) if they are far from the visible area, or with hi-pri otherwise to minimize the potential of seeing blank space.</p>
<p>Some caveats:</p>
<ul>
docs/0.19/sectionlist.html
+1 -1
View File
@@ -12,7 +12,7 @@
<li>Scroll loading.</li>
</ul>
<p>If you don't need section support and want a simpler interface, use
<a href="/react-native/flatlist.md"><code>&lt;FlatList&gt;</code></a>.</p>
<a href="/react-native/docs/0.19/flatlist.html"><code>&lt;FlatList&gt;</code></a>.</p>
<p>Simple Examples:</p>
<pre><code class="hljs css javascript">&lt;SectionList
renderItem={({item}) =&gt; &lt;ListItem title={item} /&gt;}
docs/0.19/virtualizedlist.html
+1 -1
View File
@@ -1,4 +1,4 @@
<html><head><meta charset="utf-8"/><meta http-equiv="X-UA-Compatible" content="IE=edge, chrome=1"/><title>VirtualizedList · React Native</title><meta name="viewport" content="width=device-width"/><meta name="generator" content="Docusaurus"/><meta property="og:title" content="VirtualizedList · React Native"/><meta property="og:type" content="website"/><meta property="og:url" content="https://facebook.github.io/react-native/index.html"/><meta property="og:description" content="Base implementation for the more convenient [`&lt;FlatList&gt;`](/react-native/flatlist.md) and [`&lt;SectionList&gt;`](/react-native/sectionlist.md) components, which are also better documented. In general, this should only really be used if you need more flexibility than `FlatList` provides, e.g. for use with immutable data instead of plain arrays."/><link rel="shortcut icon" href="/react-native/img/favicon.png"/><link rel="stylesheet" href="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.css"/><link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/solarized-dark.min.css"/><link rel="alternate" type="application/atom+xml" href="https://facebook.github.io/blog/atom.xml" title="React Native Blog ATOM Feed"/><link rel="alternate" type="application/rss+xml" href="https://facebook.github.io/blog/feed.xml" title="React Native Blog RSS Feed"/><script type="text/javascript" src="https://snack.expo.io/embed.js"></script><script type="text/javascript" src="/react-native/js/codeblocks.js"></script><link rel="stylesheet" href="/react-native/css/main.css"/></head><body class="sideNavVisible"><div class="fixedHeaderContainer"><div class="headerWrapper wrapper"><header><a href="/react-native/"><img class="logo" src="/react-native/img/header_logo.png"/><h2 class="headerTitle">React Native</h2></a><a href="/react-native/versions.html"><h3>0.19</h3></a><div class="navigationWrapper navigationSlider"><nav class="slidingNav"><ul class="nav-site nav-site-internal"><li><a href="/react-native/docs/0.19/getting-started.html" target="_self">Docs</a></li><li><a href="/react-native/en/help.html" target="_self">Community</a></li><li><a href="/react-native/blog" target="_self">Blog</a></li><li class="navSearchWrapper reactNavSearchWrapper"><input type="text" id="search_input_react" placeholder="Search"/></li><li><a href="https://github.com/facebook/react-native" target="_self">GitHub</a></li><li><a href="https://reactjs.org/" target="_self">React</a></li></ul></nav></div></header></div></div><div class="navPusher"><div class="docMainWrapper wrapper"><div class="container mainContainer"><div class="wrapper"><div class="post"><header class="postHeader"><a class="edit-page-link button" href="https://github.com/facebook/react-native-website/blob/master/website/versioned_docs/version-0.5/virtualizedlist.md" target="_blank">Edit</a><h1>VirtualizedList</h1></header><article><div><span><p>Base implementation for the more convenient <a href="/react-native/flatlist.md"><code>&lt;FlatList&gt;</code></a> and <a href="/react-native/sectionlist.md"><code>&lt;SectionList&gt;</code></a> components, which are also better documented. In general, this should only really be used if you need more flexibility than <code>FlatList</code> provides, e.g. for use with immutable data instead of plain arrays.</p>
<html><head><meta charset="utf-8"/><meta http-equiv="X-UA-Compatible" content="IE=edge, chrome=1"/><title>VirtualizedList · React Native</title><meta name="viewport" content="width=device-width"/><meta name="generator" content="Docusaurus"/><meta property="og:title" content="VirtualizedList · React Native"/><meta property="og:type" content="website"/><meta property="og:url" content="https://facebook.github.io/react-native/index.html"/><meta property="og:description" content="Base implementation for the more convenient [`&lt;FlatList&gt;`](/react-native/docs/0.19/flatlist.html) and [`&lt;SectionList&gt;`](/react-native/docs/0.19/sectionlist.html) components, which are also better documented. In general, this should only really be used if you need more flexibility than `FlatList` provides, e.g. for use with immutable data instead of plain arrays."/><link rel="shortcut icon" href="/react-native/img/favicon.png"/><link rel="stylesheet" href="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.css"/><link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/solarized-dark.min.css"/><link rel="alternate" type="application/atom+xml" href="https://facebook.github.io/blog/atom.xml" title="React Native Blog ATOM Feed"/><link rel="alternate" type="application/rss+xml" href="https://facebook.github.io/blog/feed.xml" title="React Native Blog RSS Feed"/><script type="text/javascript" src="https://snack.expo.io/embed.js"></script><script type="text/javascript" src="/react-native/js/codeblocks.js"></script><link rel="stylesheet" href="/react-native/css/main.css"/></head><body class="sideNavVisible"><div class="fixedHeaderContainer"><div class="headerWrapper wrapper"><header><a href="/react-native/"><img class="logo" src="/react-native/img/header_logo.png"/><h2 class="headerTitle">React Native</h2></a><a href="/react-native/versions.html"><h3>0.19</h3></a><div class="navigationWrapper navigationSlider"><nav class="slidingNav"><ul class="nav-site nav-site-internal"><li><a href="/react-native/docs/0.19/getting-started.html" target="_self">Docs</a></li><li><a href="/react-native/en/help.html" target="_self">Community</a></li><li><a href="/react-native/blog" target="_self">Blog</a></li><li class="navSearchWrapper reactNavSearchWrapper"><input type="text" id="search_input_react" placeholder="Search"/></li><li><a href="https://github.com/facebook/react-native" target="_self">GitHub</a></li><li><a href="https://reactjs.org/" target="_self">React</a></li></ul></nav></div></header></div></div><div class="navPusher"><div class="docMainWrapper wrapper"><div class="container mainContainer"><div class="wrapper"><div class="post"><header class="postHeader"><a class="edit-page-link button" href="https://github.com/facebook/react-native-website/blob/master/website/versioned_docs/version-0.5/virtualizedlist.md" target="_blank">Edit</a><h1>VirtualizedList</h1></header><article><div><span><p>Base implementation for the more convenient <a href="/react-native/docs/0.19/flatlist.html"><code>&lt;FlatList&gt;</code></a> and <a href="/react-native/docs/0.19/sectionlist.html"><code>&lt;SectionList&gt;</code></a> components, which are also better documented. In general, this should only really be used if you need more flexibility than <code>FlatList</code> provides, e.g. for use with immutable data instead of plain arrays.</p>
<p>Virtualization massively improves memory consumption and performance of large lists by maintaining a finite render window of active items and replacing all items outside of the render window with appropriately sized blank space. The window adapts to scrolling behavior, and items are rendered incrementally with low-pri (after any running interactions) if they are far from the visible area, or with hi-pri otherwise to minimize the potential of seeing blank space.</p>
<p>Some caveats:</p>
<ul>
docs/0.20/sectionlist.html
+1 -1
View File
@@ -12,7 +12,7 @@
<li>Scroll loading.</li>
</ul>
<p>If you don't need section support and want a simpler interface, use
<a href="/react-native/flatlist.md"><code>&lt;FlatList&gt;</code></a>.</p>
<a href="/react-native/docs/0.20/flatlist.html"><code>&lt;FlatList&gt;</code></a>.</p>
<p>Simple Examples:</p>
<pre><code class="hljs css javascript">&lt;SectionList
renderItem={({item}) =&gt; &lt;ListItem title={item} /&gt;}
docs/0.20/virtualizedlist.html
+1 -1
View File
@@ -1,4 +1,4 @@
<html><head><meta charset="utf-8"/><meta http-equiv="X-UA-Compatible" content="IE=edge, chrome=1"/><title>VirtualizedList · React Native</title><meta name="viewport" content="width=device-width"/><meta name="generator" content="Docusaurus"/><meta property="og:title" content="VirtualizedList · React Native"/><meta property="og:type" content="website"/><meta property="og:url" content="https://facebook.github.io/react-native/index.html"/><meta property="og:description" content="Base implementation for the more convenient [`&lt;FlatList&gt;`](/react-native/flatlist.md) and [`&lt;SectionList&gt;`](/react-native/sectionlist.md) components, which are also better documented. In general, this should only really be used if you need more flexibility than `FlatList` provides, e.g. for use with immutable data instead of plain arrays."/><link rel="shortcut icon" href="/react-native/img/favicon.png"/><link rel="stylesheet" href="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.css"/><link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/solarized-dark.min.css"/><link rel="alternate" type="application/atom+xml" href="https://facebook.github.io/blog/atom.xml" title="React Native Blog ATOM Feed"/><link rel="alternate" type="application/rss+xml" href="https://facebook.github.io/blog/feed.xml" title="React Native Blog RSS Feed"/><script type="text/javascript" src="https://snack.expo.io/embed.js"></script><script type="text/javascript" src="/react-native/js/codeblocks.js"></script><link rel="stylesheet" href="/react-native/css/main.css"/></head><body class="sideNavVisible"><div class="fixedHeaderContainer"><div class="headerWrapper wrapper"><header><a href="/react-native/"><img class="logo" src="/react-native/img/header_logo.png"/><h2 class="headerTitle">React Native</h2></a><a href="/react-native/versions.html"><h3>0.20</h3></a><div class="navigationWrapper navigationSlider"><nav class="slidingNav"><ul class="nav-site nav-site-internal"><li><a href="/react-native/docs/0.20/getting-started.html" target="_self">Docs</a></li><li><a href="/react-native/en/help.html" target="_self">Community</a></li><li><a href="/react-native/blog" target="_self">Blog</a></li><li class="navSearchWrapper reactNavSearchWrapper"><input type="text" id="search_input_react" placeholder="Search"/></li><li><a href="https://github.com/facebook/react-native" target="_self">GitHub</a></li><li><a href="https://reactjs.org/" target="_self">React</a></li></ul></nav></div></header></div></div><div class="navPusher"><div class="docMainWrapper wrapper"><div class="container mainContainer"><div class="wrapper"><div class="post"><header class="postHeader"><a class="edit-page-link button" href="https://github.com/facebook/react-native-website/blob/master/website/versioned_docs/version-0.5/virtualizedlist.md" target="_blank">Edit</a><h1>VirtualizedList</h1></header><article><div><span><p>Base implementation for the more convenient <a href="/react-native/flatlist.md"><code>&lt;FlatList&gt;</code></a> and <a href="/react-native/sectionlist.md"><code>&lt;SectionList&gt;</code></a> components, which are also better documented. In general, this should only really be used if you need more flexibility than <code>FlatList</code> provides, e.g. for use with immutable data instead of plain arrays.</p>
<html><head><meta charset="utf-8"/><meta http-equiv="X-UA-Compatible" content="IE=edge, chrome=1"/><title>VirtualizedList · React Native</title><meta name="viewport" content="width=device-width"/><meta name="generator" content="Docusaurus"/><meta property="og:title" content="VirtualizedList · React Native"/><meta property="og:type" content="website"/><meta property="og:url" content="https://facebook.github.io/react-native/index.html"/><meta property="og:description" content="Base implementation for the more convenient [`&lt;FlatList&gt;`](/react-native/docs/0.20/flatlist.html) and [`&lt;SectionList&gt;`](/react-native/docs/0.20/sectionlist.html) components, which are also better documented. In general, this should only really be used if you need more flexibility than `FlatList` provides, e.g. for use with immutable data instead of plain arrays."/><link rel="shortcut icon" href="/react-native/img/favicon.png"/><link rel="stylesheet" href="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.css"/><link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/solarized-dark.min.css"/><link rel="alternate" type="application/atom+xml" href="https://facebook.github.io/blog/atom.xml" title="React Native Blog ATOM Feed"/><link rel="alternate" type="application/rss+xml" href="https://facebook.github.io/blog/feed.xml" title="React Native Blog RSS Feed"/><script type="text/javascript" src="https://snack.expo.io/embed.js"></script><script type="text/javascript" src="/react-native/js/codeblocks.js"></script><link rel="stylesheet" href="/react-native/css/main.css"/></head><body class="sideNavVisible"><div class="fixedHeaderContainer"><div class="headerWrapper wrapper"><header><a href="/react-native/"><img class="logo" src="/react-native/img/header_logo.png"/><h2 class="headerTitle">React Native</h2></a><a href="/react-native/versions.html"><h3>0.20</h3></a><div class="navigationWrapper navigationSlider"><nav class="slidingNav"><ul class="nav-site nav-site-internal"><li><a href="/react-native/docs/0.20/getting-started.html" target="_self">Docs</a></li><li><a href="/react-native/en/help.html" target="_self">Community</a></li><li><a href="/react-native/blog" target="_self">Blog</a></li><li class="navSearchWrapper reactNavSearchWrapper"><input type="text" id="search_input_react" placeholder="Search"/></li><li><a href="https://github.com/facebook/react-native" target="_self">GitHub</a></li><li><a href="https://reactjs.org/" target="_self">React</a></li></ul></nav></div></header></div></div><div class="navPusher"><div class="docMainWrapper wrapper"><div class="container mainContainer"><div class="wrapper"><div class="post"><header class="postHeader"><a class="edit-page-link button" href="https://github.com/facebook/react-native-website/blob/master/website/versioned_docs/version-0.5/virtualizedlist.md" target="_blank">Edit</a><h1>VirtualizedList</h1></header><article><div><span><p>Base implementation for the more convenient <a href="/react-native/docs/0.20/flatlist.html"><code>&lt;FlatList&gt;</code></a> and <a href="/react-native/docs/0.20/sectionlist.html"><code>&lt;SectionList&gt;</code></a> components, which are also better documented. In general, this should only really be used if you need more flexibility than <code>FlatList</code> provides, e.g. for use with immutable data instead of plain arrays.</p>
<p>Virtualization massively improves memory consumption and performance of large lists by maintaining a finite render window of active items and replacing all items outside of the render window with appropriately sized blank space. The window adapts to scrolling behavior, and items are rendered incrementally with low-pri (after any running interactions) if they are far from the visible area, or with hi-pri otherwise to minimize the potential of seeing blank space.</p>
<p>Some caveats:</p>
<ul>
docs/0.21/sectionlist.html
+1 -1
View File
@@ -12,7 +12,7 @@
<li>Scroll loading.</li>
</ul>
<p>If you don't need section support and want a simpler interface, use
<a href="/react-native/flatlist.md"><code>&lt;FlatList&gt;</code></a>.</p>
<a href="/react-native/docs/0.21/flatlist.html"><code>&lt;FlatList&gt;</code></a>.</p>
<p>Simple Examples:</p>
<pre><code class="hljs css javascript">&lt;SectionList
renderItem={({item}) =&gt; &lt;ListItem title={item} /&gt;}
docs/0.21/virtualizedlist.html
+1 -1
View File
@@ -1,4 +1,4 @@
<html><head><meta charset="utf-8"/><meta http-equiv="X-UA-Compatible" content="IE=edge, chrome=1"/><title>VirtualizedList · React Native</title><meta name="viewport" content="width=device-width"/><meta name="generator" content="Docusaurus"/><meta property="og:title" content="VirtualizedList · React Native"/><meta property="og:type" content="website"/><meta property="og:url" content="https://facebook.github.io/react-native/index.html"/><meta property="og:description" content="Base implementation for the more convenient [`&lt;FlatList&gt;`](/react-native/flatlist.md) and [`&lt;SectionList&gt;`](/react-native/sectionlist.md) components, which are also better documented. In general, this should only really be used if you need more flexibility than `FlatList` provides, e.g. for use with immutable data instead of plain arrays."/><link rel="shortcut icon" href="/react-native/img/favicon.png"/><link rel="stylesheet" href="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.css"/><link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/solarized-dark.min.css"/><link rel="alternate" type="application/atom+xml" href="https://facebook.github.io/blog/atom.xml" title="React Native Blog ATOM Feed"/><link rel="alternate" type="application/rss+xml" href="https://facebook.github.io/blog/feed.xml" title="React Native Blog RSS Feed"/><script type="text/javascript" src="https://snack.expo.io/embed.js"></script><script type="text/javascript" src="/react-native/js/codeblocks.js"></script><link rel="stylesheet" href="/react-native/css/main.css"/></head><body class="sideNavVisible"><div class="fixedHeaderContainer"><div class="headerWrapper wrapper"><header><a href="/react-native/"><img class="logo" src="/react-native/img/header_logo.png"/><h2 class="headerTitle">React Native</h2></a><a href="/react-native/versions.html"><h3>0.21</h3></a><div class="navigationWrapper navigationSlider"><nav class="slidingNav"><ul class="nav-site nav-site-internal"><li><a href="/react-native/docs/0.21/getting-started.html" target="_self">Docs</a></li><li><a href="/react-native/en/help.html" target="_self">Community</a></li><li><a href="/react-native/blog" target="_self">Blog</a></li><li class="navSearchWrapper reactNavSearchWrapper"><input type="text" id="search_input_react" placeholder="Search"/></li><li><a href="https://github.com/facebook/react-native" target="_self">GitHub</a></li><li><a href="https://reactjs.org/" target="_self">React</a></li></ul></nav></div></header></div></div><div class="navPusher"><div class="docMainWrapper wrapper"><div class="container mainContainer"><div class="wrapper"><div class="post"><header class="postHeader"><a class="edit-page-link button" href="https://github.com/facebook/react-native-website/blob/master/website/versioned_docs/version-0.5/virtualizedlist.md" target="_blank">Edit</a><h1>VirtualizedList</h1></header><article><div><span><p>Base implementation for the more convenient <a href="/react-native/flatlist.md"><code>&lt;FlatList&gt;</code></a> and <a href="/react-native/sectionlist.md"><code>&lt;SectionList&gt;</code></a> components, which are also better documented. In general, this should only really be used if you need more flexibility than <code>FlatList</code> provides, e.g. for use with immutable data instead of plain arrays.</p>
<html><head><meta charset="utf-8"/><meta http-equiv="X-UA-Compatible" content="IE=edge, chrome=1"/><title>VirtualizedList · React Native</title><meta name="viewport" content="width=device-width"/><meta name="generator" content="Docusaurus"/><meta property="og:title" content="VirtualizedList · React Native"/><meta property="og:type" content="website"/><meta property="og:url" content="https://facebook.github.io/react-native/index.html"/><meta property="og:description" content="Base implementation for the more convenient [`&lt;FlatList&gt;`](/react-native/docs/0.21/flatlist.html) and [`&lt;SectionList&gt;`](/react-native/docs/0.21/sectionlist.html) components, which are also better documented. In general, this should only really be used if you need more flexibility than `FlatList` provides, e.g. for use with immutable data instead of plain arrays."/><link rel="shortcut icon" href="/react-native/img/favicon.png"/><link rel="stylesheet" href="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.css"/><link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/solarized-dark.min.css"/><link rel="alternate" type="application/atom+xml" href="https://facebook.github.io/blog/atom.xml" title="React Native Blog ATOM Feed"/><link rel="alternate" type="application/rss+xml" href="https://facebook.github.io/blog/feed.xml" title="React Native Blog RSS Feed"/><script type="text/javascript" src="https://snack.expo.io/embed.js"></script><script type="text/javascript" src="/react-native/js/codeblocks.js"></script><link rel="stylesheet" href="/react-native/css/main.css"/></head><body class="sideNavVisible"><div class="fixedHeaderContainer"><div class="headerWrapper wrapper"><header><a href="/react-native/"><img class="logo" src="/react-native/img/header_logo.png"/><h2 class="headerTitle">React Native</h2></a><a href="/react-native/versions.html"><h3>0.21</h3></a><div class="navigationWrapper navigationSlider"><nav class="slidingNav"><ul class="nav-site nav-site-internal"><li><a href="/react-native/docs/0.21/getting-started.html" target="_self">Docs</a></li><li><a href="/react-native/en/help.html" target="_self">Community</a></li><li><a href="/react-native/blog" target="_self">Blog</a></li><li class="navSearchWrapper reactNavSearchWrapper"><input type="text" id="search_input_react" placeholder="Search"/></li><li><a href="https://github.com/facebook/react-native" target="_self">GitHub</a></li><li><a href="https://reactjs.org/" target="_self">React</a></li></ul></nav></div></header></div></div><div class="navPusher"><div class="docMainWrapper wrapper"><div class="container mainContainer"><div class="wrapper"><div class="post"><header class="postHeader"><a class="edit-page-link button" href="https://github.com/facebook/react-native-website/blob/master/website/versioned_docs/version-0.5/virtualizedlist.md" target="_blank">Edit</a><h1>VirtualizedList</h1></header><article><div><span><p>Base implementation for the more convenient <a href="/react-native/docs/0.21/flatlist.html"><code>&lt;FlatList&gt;</code></a> and <a href="/react-native/docs/0.21/sectionlist.html"><code>&lt;SectionList&gt;</code></a> components, which are also better documented. In general, this should only really be used if you need more flexibility than <code>FlatList</code> provides, e.g. for use with immutable data instead of plain arrays.</p>
<p>Virtualization massively improves memory consumption and performance of large lists by maintaining a finite render window of active items and replacing all items outside of the render window with appropriately sized blank space. The window adapts to scrolling behavior, and items are rendered incrementally with low-pri (after any running interactions) if they are far from the visible area, or with hi-pri otherwise to minimize the potential of seeing blank space.</p>
<p>Some caveats:</p>
<ul>
docs/0.22/sectionlist.html
+1 -1
View File
@@ -12,7 +12,7 @@
<li>Scroll loading.</li>
</ul>
<p>If you don't need section support and want a simpler interface, use
<a href="/react-native/flatlist.md"><code>&lt;FlatList&gt;</code></a>.</p>
<a href="/react-native/docs/0.22/flatlist.html"><code>&lt;FlatList&gt;</code></a>.</p>
<p>Simple Examples:</p>
<pre><code class="hljs css javascript">&lt;SectionList
renderItem={({item}) =&gt; &lt;ListItem title={item} /&gt;}
docs/0.22/virtualizedlist.html
+1 -1
View File
@@ -1,4 +1,4 @@
<html><head><meta charset="utf-8"/><meta http-equiv="X-UA-Compatible" content="IE=edge, chrome=1"/><title>VirtualizedList · React Native</title><meta name="viewport" content="width=device-width"/><meta name="generator" content="Docusaurus"/><meta property="og:title" content="VirtualizedList · React Native"/><meta property="og:type" content="website"/><meta property="og:url" content="https://facebook.github.io/react-native/index.html"/><meta property="og:description" content="Base implementation for the more convenient [`&lt;FlatList&gt;`](/react-native/flatlist.md) and [`&lt;SectionList&gt;`](/react-native/sectionlist.md) components, which are also better documented. In general, this should only really be used if you need more flexibility than `FlatList` provides, e.g. for use with immutable data instead of plain arrays."/><link rel="shortcut icon" href="/react-native/img/favicon.png"/><link rel="stylesheet" href="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.css"/><link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/solarized-dark.min.css"/><link rel="alternate" type="application/atom+xml" href="https://facebook.github.io/blog/atom.xml" title="React Native Blog ATOM Feed"/><link rel="alternate" type="application/rss+xml" href="https://facebook.github.io/blog/feed.xml" title="React Native Blog RSS Feed"/><script type="text/javascript" src="https://snack.expo.io/embed.js"></script><script type="text/javascript" src="/react-native/js/codeblocks.js"></script><link rel="stylesheet" href="/react-native/css/main.css"/></head><body class="sideNavVisible"><div class="fixedHeaderContainer"><div class="headerWrapper wrapper"><header><a href="/react-native/"><img class="logo" src="/react-native/img/header_logo.png"/><h2 class="headerTitle">React Native</h2></a><a href="/react-native/versions.html"><h3>0.22</h3></a><div class="navigationWrapper navigationSlider"><nav class="slidingNav"><ul class="nav-site nav-site-internal"><li><a href="/react-native/docs/0.22/getting-started.html" target="_self">Docs</a></li><li><a href="/react-native/en/help.html" target="_self">Community</a></li><li><a href="/react-native/blog" target="_self">Blog</a></li><li class="navSearchWrapper reactNavSearchWrapper"><input type="text" id="search_input_react" placeholder="Search"/></li><li><a href="https://github.com/facebook/react-native" target="_self">GitHub</a></li><li><a href="https://reactjs.org/" target="_self">React</a></li></ul></nav></div></header></div></div><div class="navPusher"><div class="docMainWrapper wrapper"><div class="container mainContainer"><div class="wrapper"><div class="post"><header class="postHeader"><a class="edit-page-link button" href="https://github.com/facebook/react-native-website/blob/master/website/versioned_docs/version-0.5/virtualizedlist.md" target="_blank">Edit</a><h1>VirtualizedList</h1></header><article><div><span><p>Base implementation for the more convenient <a href="/react-native/flatlist.md"><code>&lt;FlatList&gt;</code></a> and <a href="/react-native/sectionlist.md"><code>&lt;SectionList&gt;</code></a> components, which are also better documented. In general, this should only really be used if you need more flexibility than <code>FlatList</code> provides, e.g. for use with immutable data instead of plain arrays.</p>
<html><head><meta charset="utf-8"/><meta http-equiv="X-UA-Compatible" content="IE=edge, chrome=1"/><title>VirtualizedList · React Native</title><meta name="viewport" content="width=device-width"/><meta name="generator" content="Docusaurus"/><meta property="og:title" content="VirtualizedList · React Native"/><meta property="og:type" content="website"/><meta property="og:url" content="https://facebook.github.io/react-native/index.html"/><meta property="og:description" content="Base implementation for the more convenient [`&lt;FlatList&gt;`](/react-native/docs/0.22/flatlist.html) and [`&lt;SectionList&gt;`](/react-native/docs/0.22/sectionlist.html) components, which are also better documented. In general, this should only really be used if you need more flexibility than `FlatList` provides, e.g. for use with immutable data instead of plain arrays."/><link rel="shortcut icon" href="/react-native/img/favicon.png"/><link rel="stylesheet" href="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.css"/><link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/solarized-dark.min.css"/><link rel="alternate" type="application/atom+xml" href="https://facebook.github.io/blog/atom.xml" title="React Native Blog ATOM Feed"/><link rel="alternate" type="application/rss+xml" href="https://facebook.github.io/blog/feed.xml" title="React Native Blog RSS Feed"/><script type="text/javascript" src="https://snack.expo.io/embed.js"></script><script type="text/javascript" src="/react-native/js/codeblocks.js"></script><link rel="stylesheet" href="/react-native/css/main.css"/></head><body class="sideNavVisible"><div class="fixedHeaderContainer"><div class="headerWrapper wrapper"><header><a href="/react-native/"><img class="logo" src="/react-native/img/header_logo.png"/><h2 class="headerTitle">React Native</h2></a><a href="/react-native/versions.html"><h3>0.22</h3></a><div class="navigationWrapper navigationSlider"><nav class="slidingNav"><ul class="nav-site nav-site-internal"><li><a href="/react-native/docs/0.22/getting-started.html" target="_self">Docs</a></li><li><a href="/react-native/en/help.html" target="_self">Community</a></li><li><a href="/react-native/blog" target="_self">Blog</a></li><li class="navSearchWrapper reactNavSearchWrapper"><input type="text" id="search_input_react" placeholder="Search"/></li><li><a href="https://github.com/facebook/react-native" target="_self">GitHub</a></li><li><a href="https://reactjs.org/" target="_self">React</a></li></ul></nav></div></header></div></div><div class="navPusher"><div class="docMainWrapper wrapper"><div class="container mainContainer"><div class="wrapper"><div class="post"><header class="postHeader"><a class="edit-page-link button" href="https://github.com/facebook/react-native-website/blob/master/website/versioned_docs/version-0.5/virtualizedlist.md" target="_blank">Edit</a><h1>VirtualizedList</h1></header><article><div><span><p>Base implementation for the more convenient <a href="/react-native/docs/0.22/flatlist.html"><code>&lt;FlatList&gt;</code></a> and <a href="/react-native/docs/0.22/sectionlist.html"><code>&lt;SectionList&gt;</code></a> components, which are also better documented. In general, this should only really be used if you need more flexibility than <code>FlatList</code> provides, e.g. for use with immutable data instead of plain arrays.</p>
<p>Virtualization massively improves memory consumption and performance of large lists by maintaining a finite render window of active items and replacing all items outside of the render window with appropriately sized blank space. The window adapts to scrolling behavior, and items are rendered incrementally with low-pri (after any running interactions) if they are far from the visible area, or with hi-pri otherwise to minimize the potential of seeing blank space.</p>
<p>Some caveats:</p>
<ul>
docs/0.23/sectionlist.html
+1 -1
View File
@@ -12,7 +12,7 @@
<li>Scroll loading.</li>
</ul>
<p>If you don't need section support and want a simpler interface, use
<a href="/react-native/flatlist.md"><code>&lt;FlatList&gt;</code></a>.</p>
<a href="/react-native/docs/0.23/flatlist.html"><code>&lt;FlatList&gt;</code></a>.</p>
<p>Simple Examples:</p>
<pre><code class="hljs css javascript">&lt;SectionList
renderItem={({item}) =&gt; &lt;ListItem title={item} /&gt;}
docs/0.23/virtualizedlist.html
+1 -1
View File
@@ -1,4 +1,4 @@
<html><head><meta charset="utf-8"/><meta http-equiv="X-UA-Compatible" content="IE=edge, chrome=1"/><title>VirtualizedList · React Native</title><meta name="viewport" content="width=device-width"/><meta name="generator" content="Docusaurus"/><meta property="og:title" content="VirtualizedList · React Native"/><meta property="og:type" content="website"/><meta property="og:url" content="https://facebook.github.io/react-native/index.html"/><meta property="og:description" content="Base implementation for the more convenient [`&lt;FlatList&gt;`](/react-native/flatlist.md) and [`&lt;SectionList&gt;`](/react-native/sectionlist.md) components, which are also better documented. In general, this should only really be used if you need more flexibility than `FlatList` provides, e.g. for use with immutable data instead of plain arrays."/><link rel="shortcut icon" href="/react-native/img/favicon.png"/><link rel="stylesheet" href="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.css"/><link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/solarized-dark.min.css"/><link rel="alternate" type="application/atom+xml" href="https://facebook.github.io/blog/atom.xml" title="React Native Blog ATOM Feed"/><link rel="alternate" type="application/rss+xml" href="https://facebook.github.io/blog/feed.xml" title="React Native Blog RSS Feed"/><script type="text/javascript" src="https://snack.expo.io/embed.js"></script><script type="text/javascript" src="/react-native/js/codeblocks.js"></script><link rel="stylesheet" href="/react-native/css/main.css"/></head><body class="sideNavVisible"><div class="fixedHeaderContainer"><div class="headerWrapper wrapper"><header><a href="/react-native/"><img class="logo" src="/react-native/img/header_logo.png"/><h2 class="headerTitle">React Native</h2></a><a href="/react-native/versions.html"><h3>0.23</h3></a><div class="navigationWrapper navigationSlider"><nav class="slidingNav"><ul class="nav-site nav-site-internal"><li><a href="/react-native/docs/0.23/getting-started.html" target="_self">Docs</a></li><li><a href="/react-native/en/help.html" target="_self">Community</a></li><li><a href="/react-native/blog" target="_self">Blog</a></li><li class="navSearchWrapper reactNavSearchWrapper"><input type="text" id="search_input_react" placeholder="Search"/></li><li><a href="https://github.com/facebook/react-native" target="_self">GitHub</a></li><li><a href="https://reactjs.org/" target="_self">React</a></li></ul></nav></div></header></div></div><div class="navPusher"><div class="docMainWrapper wrapper"><div class="container mainContainer"><div class="wrapper"><div class="post"><header class="postHeader"><a class="edit-page-link button" href="https://github.com/facebook/react-native-website/blob/master/website/versioned_docs/version-0.5/virtualizedlist.md" target="_blank">Edit</a><h1>VirtualizedList</h1></header><article><div><span><p>Base implementation for the more convenient <a href="/react-native/flatlist.md"><code>&lt;FlatList&gt;</code></a> and <a href="/react-native/sectionlist.md"><code>&lt;SectionList&gt;</code></a> components, which are also better documented. In general, this should only really be used if you need more flexibility than <code>FlatList</code> provides, e.g. for use with immutable data instead of plain arrays.</p>
<html><head><meta charset="utf-8"/><meta http-equiv="X-UA-Compatible" content="IE=edge, chrome=1"/><title>VirtualizedList · React Native</title><meta name="viewport" content="width=device-width"/><meta name="generator" content="Docusaurus"/><meta property="og:title" content="VirtualizedList · React Native"/><meta property="og:type" content="website"/><meta property="og:url" content="https://facebook.github.io/react-native/index.html"/><meta property="og:description" content="Base implementation for the more convenient [`&lt;FlatList&gt;`](/react-native/docs/0.23/flatlist.html) and [`&lt;SectionList&gt;`](/react-native/docs/0.23/sectionlist.html) components, which are also better documented. In general, this should only really be used if you need more flexibility than `FlatList` provides, e.g. for use with immutable data instead of plain arrays."/><link rel="shortcut icon" href="/react-native/img/favicon.png"/><link rel="stylesheet" href="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.css"/><link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/solarized-dark.min.css"/><link rel="alternate" type="application/atom+xml" href="https://facebook.github.io/blog/atom.xml" title="React Native Blog ATOM Feed"/><link rel="alternate" type="application/rss+xml" href="https://facebook.github.io/blog/feed.xml" title="React Native Blog RSS Feed"/><script type="text/javascript" src="https://snack.expo.io/embed.js"></script><script type="text/javascript" src="/react-native/js/codeblocks.js"></script><link rel="stylesheet" href="/react-native/css/main.css"/></head><body class="sideNavVisible"><div class="fixedHeaderContainer"><div class="headerWrapper wrapper"><header><a href="/react-native/"><img class="logo" src="/react-native/img/header_logo.png"/><h2 class="headerTitle">React Native</h2></a><a href="/react-native/versions.html"><h3>0.23</h3></a><div class="navigationWrapper navigationSlider"><nav class="slidingNav"><ul class="nav-site nav-site-internal"><li><a href="/react-native/docs/0.23/getting-started.html" target="_self">Docs</a></li><li><a href="/react-native/en/help.html" target="_self">Community</a></li><li><a href="/react-native/blog" target="_self">Blog</a></li><li class="navSearchWrapper reactNavSearchWrapper"><input type="text" id="search_input_react" placeholder="Search"/></li><li><a href="https://github.com/facebook/react-native" target="_self">GitHub</a></li><li><a href="https://reactjs.org/" target="_self">React</a></li></ul></nav></div></header></div></div><div class="navPusher"><div class="docMainWrapper wrapper"><div class="container mainContainer"><div class="wrapper"><div class="post"><header class="postHeader"><a class="edit-page-link button" href="https://github.com/facebook/react-native-website/blob/master/website/versioned_docs/version-0.5/virtualizedlist.md" target="_blank">Edit</a><h1>VirtualizedList</h1></header><article><div><span><p>Base implementation for the more convenient <a href="/react-native/docs/0.23/flatlist.html"><code>&lt;FlatList&gt;</code></a> and <a href="/react-native/docs/0.23/sectionlist.html"><code>&lt;SectionList&gt;</code></a> components, which are also better documented. In general, this should only really be used if you need more flexibility than <code>FlatList</code> provides, e.g. for use with immutable data instead of plain arrays.</p>
<p>Virtualization massively improves memory consumption and performance of large lists by maintaining a finite render window of active items and replacing all items outside of the render window with appropriately sized blank space. The window adapts to scrolling behavior, and items are rendered incrementally with low-pri (after any running interactions) if they are far from the visible area, or with hi-pri otherwise to minimize the potential of seeing blank space.</p>
<p>Some caveats:</p>
<ul>
docs/0.24/sectionlist.html
+1 -1
View File
@@ -12,7 +12,7 @@
<li>Scroll loading.</li>
</ul>
<p>If you don't need section support and want a simpler interface, use
<a href="/react-native/flatlist.md"><code>&lt;FlatList&gt;</code></a>.</p>
<a href="/react-native/docs/0.24/flatlist.html"><code>&lt;FlatList&gt;</code></a>.</p>
<p>Simple Examples:</p>
<pre><code class="hljs css javascript">&lt;SectionList
renderItem={({item}) =&gt; &lt;ListItem title={item} /&gt;}
docs/0.24/virtualizedlist.html
+1 -1
View File
@@ -1,4 +1,4 @@
<html><head><meta charset="utf-8"/><meta http-equiv="X-UA-Compatible" content="IE=edge, chrome=1"/><title>VirtualizedList · React Native</title><meta name="viewport" content="width=device-width"/><meta name="generator" content="Docusaurus"/><meta property="og:title" content="VirtualizedList · React Native"/><meta property="og:type" content="website"/><meta property="og:url" content="https://facebook.github.io/react-native/index.html"/><meta property="og:description" content="Base implementation for the more convenient [`&lt;FlatList&gt;`](/react-native/flatlist.md) and [`&lt;SectionList&gt;`](/react-native/sectionlist.md) components, which are also better documented. In general, this should only really be used if you need more flexibility than `FlatList` provides, e.g. for use with immutable data instead of plain arrays."/><link rel="shortcut icon" href="/react-native/img/favicon.png"/><link rel="stylesheet" href="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.css"/><link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/solarized-dark.min.css"/><link rel="alternate" type="application/atom+xml" href="https://facebook.github.io/blog/atom.xml" title="React Native Blog ATOM Feed"/><link rel="alternate" type="application/rss+xml" href="https://facebook.github.io/blog/feed.xml" title="React Native Blog RSS Feed"/><script type="text/javascript" src="https://snack.expo.io/embed.js"></script><script type="text/javascript" src="/react-native/js/codeblocks.js"></script><link rel="stylesheet" href="/react-native/css/main.css"/></head><body class="sideNavVisible"><div class="fixedHeaderContainer"><div class="headerWrapper wrapper"><header><a href="/react-native/"><img class="logo" src="/react-native/img/header_logo.png"/><h2 class="headerTitle">React Native</h2></a><a href="/react-native/versions.html"><h3>0.24</h3></a><div class="navigationWrapper navigationSlider"><nav class="slidingNav"><ul class="nav-site nav-site-internal"><li><a href="/react-native/docs/0.24/getting-started.html" target="_self">Docs</a></li><li><a href="/react-native/en/help.html" target="_self">Community</a></li><li><a href="/react-native/blog" target="_self">Blog</a></li><li class="navSearchWrapper reactNavSearchWrapper"><input type="text" id="search_input_react" placeholder="Search"/></li><li><a href="https://github.com/facebook/react-native" target="_self">GitHub</a></li><li><a href="https://reactjs.org/" target="_self">React</a></li></ul></nav></div></header></div></div><div class="navPusher"><div class="docMainWrapper wrapper"><div class="container mainContainer"><div class="wrapper"><div class="post"><header class="postHeader"><a class="edit-page-link button" href="https://github.com/facebook/react-native-website/blob/master/website/versioned_docs/version-0.5/virtualizedlist.md" target="_blank">Edit</a><h1>VirtualizedList</h1></header><article><div><span><p>Base implementation for the more convenient <a href="/react-native/flatlist.md"><code>&lt;FlatList&gt;</code></a> and <a href="/react-native/sectionlist.md"><code>&lt;SectionList&gt;</code></a> components, which are also better documented. In general, this should only really be used if you need more flexibility than <code>FlatList</code> provides, e.g. for use with immutable data instead of plain arrays.</p>
<html><head><meta charset="utf-8"/><meta http-equiv="X-UA-Compatible" content="IE=edge, chrome=1"/><title>VirtualizedList · React Native</title><meta name="viewport" content="width=device-width"/><meta name="generator" content="Docusaurus"/><meta property="og:title" content="VirtualizedList · React Native"/><meta property="og:type" content="website"/><meta property="og:url" content="https://facebook.github.io/react-native/index.html"/><meta property="og:description" content="Base implementation for the more convenient [`&lt;FlatList&gt;`](/react-native/docs/0.24/flatlist.html) and [`&lt;SectionList&gt;`](/react-native/docs/0.24/sectionlist.html) components, which are also better documented. In general, this should only really be used if you need more flexibility than `FlatList` provides, e.g. for use with immutable data instead of plain arrays."/><link rel="shortcut icon" href="/react-native/img/favicon.png"/><link rel="stylesheet" href="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.css"/><link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/solarized-dark.min.css"/><link rel="alternate" type="application/atom+xml" href="https://facebook.github.io/blog/atom.xml" title="React Native Blog ATOM Feed"/><link rel="alternate" type="application/rss+xml" href="https://facebook.github.io/blog/feed.xml" title="React Native Blog RSS Feed"/><script type="text/javascript" src="https://snack.expo.io/embed.js"></script><script type="text/javascript" src="/react-native/js/codeblocks.js"></script><link rel="stylesheet" href="/react-native/css/main.css"/></head><body class="sideNavVisible"><div class="fixedHeaderContainer"><div class="headerWrapper wrapper"><header><a href="/react-native/"><img class="logo" src="/react-native/img/header_logo.png"/><h2 class="headerTitle">React Native</h2></a><a href="/react-native/versions.html"><h3>0.24</h3></a><div class="navigationWrapper navigationSlider"><nav class="slidingNav"><ul class="nav-site nav-site-internal"><li><a href="/react-native/docs/0.24/getting-started.html" target="_self">Docs</a></li><li><a href="/react-native/en/help.html" target="_self">Community</a></li><li><a href="/react-native/blog" target="_self">Blog</a></li><li class="navSearchWrapper reactNavSearchWrapper"><input type="text" id="search_input_react" placeholder="Search"/></li><li><a href="https://github.com/facebook/react-native" target="_self">GitHub</a></li><li><a href="https://reactjs.org/" target="_self">React</a></li></ul></nav></div></header></div></div><div class="navPusher"><div class="docMainWrapper wrapper"><div class="container mainContainer"><div class="wrapper"><div class="post"><header class="postHeader"><a class="edit-page-link button" href="https://github.com/facebook/react-native-website/blob/master/website/versioned_docs/version-0.5/virtualizedlist.md" target="_blank">Edit</a><h1>VirtualizedList</h1></header><article><div><span><p>Base implementation for the more convenient <a href="/react-native/docs/0.24/flatlist.html"><code>&lt;FlatList&gt;</code></a> and <a href="/react-native/docs/0.24/sectionlist.html"><code>&lt;SectionList&gt;</code></a> components, which are also better documented. In general, this should only really be used if you need more flexibility than <code>FlatList</code> provides, e.g. for use with immutable data instead of plain arrays.</p>
<p>Virtualization massively improves memory consumption and performance of large lists by maintaining a finite render window of active items and replacing all items outside of the render window with appropriately sized blank space. The window adapts to scrolling behavior, and items are rendered incrementally with low-pri (after any running interactions) if they are far from the visible area, or with hi-pri otherwise to minimize the potential of seeing blank space.</p>
<p>Some caveats:</p>
<ul>
docs/0.25/sectionlist.html
+1 -1
View File
@@ -12,7 +12,7 @@
<li>Scroll loading.</li>
</ul>
<p>If you don't need section support and want a simpler interface, use
<a href="/react-native/flatlist.md"><code>&lt;FlatList&gt;</code></a>.</p>
<a href="/react-native/docs/0.25/flatlist.html"><code>&lt;FlatList&gt;</code></a>.</p>
<p>Simple Examples:</p>
<pre><code class="hljs css javascript">&lt;SectionList
renderItem={({item}) =&gt; &lt;ListItem title={item} /&gt;}
docs/0.25/virtualizedlist.html
+1 -1
View File
@@ -1,4 +1,4 @@
<html><head><meta charset="utf-8"/><meta http-equiv="X-UA-Compatible" content="IE=edge, chrome=1"/><title>VirtualizedList · React Native</title><meta name="viewport" content="width=device-width"/><meta name="generator" content="Docusaurus"/><meta property="og:title" content="VirtualizedList · React Native"/><meta property="og:type" content="website"/><meta property="og:url" content="https://facebook.github.io/react-native/index.html"/><meta property="og:description" content="Base implementation for the more convenient [`&lt;FlatList&gt;`](/react-native/flatlist.md) and [`&lt;SectionList&gt;`](/react-native/sectionlist.md) components, which are also better documented. In general, this should only really be used if you need more flexibility than `FlatList` provides, e.g. for use with immutable data instead of plain arrays."/><link rel="shortcut icon" href="/react-native/img/favicon.png"/><link rel="stylesheet" href="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.css"/><link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/solarized-dark.min.css"/><link rel="alternate" type="application/atom+xml" href="https://facebook.github.io/blog/atom.xml" title="React Native Blog ATOM Feed"/><link rel="alternate" type="application/rss+xml" href="https://facebook.github.io/blog/feed.xml" title="React Native Blog RSS Feed"/><script type="text/javascript" src="https://snack.expo.io/embed.js"></script><script type="text/javascript" src="/react-native/js/codeblocks.js"></script><link rel="stylesheet" href="/react-native/css/main.css"/></head><body class="sideNavVisible"><div class="fixedHeaderContainer"><div class="headerWrapper wrapper"><header><a href="/react-native/"><img class="logo" src="/react-native/img/header_logo.png"/><h2 class="headerTitle">React Native</h2></a><a href="/react-native/versions.html"><h3>0.25</h3></a><div class="navigationWrapper navigationSlider"><nav class="slidingNav"><ul class="nav-site nav-site-internal"><li><a href="/react-native/docs/0.25/getting-started.html" target="_self">Docs</a></li><li><a href="/react-native/en/help.html" target="_self">Community</a></li><li><a href="/react-native/blog" target="_self">Blog</a></li><li class="navSearchWrapper reactNavSearchWrapper"><input type="text" id="search_input_react" placeholder="Search"/></li><li><a href="https://github.com/facebook/react-native" target="_self">GitHub</a></li><li><a href="https://reactjs.org/" target="_self">React</a></li></ul></nav></div></header></div></div><div class="navPusher"><div class="docMainWrapper wrapper"><div class="container mainContainer"><div class="wrapper"><div class="post"><header class="postHeader"><a class="edit-page-link button" href="https://github.com/facebook/react-native-website/blob/master/website/versioned_docs/version-0.5/virtualizedlist.md" target="_blank">Edit</a><h1>VirtualizedList</h1></header><article><div><span><p>Base implementation for the more convenient <a href="/react-native/flatlist.md"><code>&lt;FlatList&gt;</code></a> and <a href="/react-native/sectionlist.md"><code>&lt;SectionList&gt;</code></a> components, which are also better documented. In general, this should only really be used if you need more flexibility than <code>FlatList</code> provides, e.g. for use with immutable data instead of plain arrays.</p>
<html><head><meta charset="utf-8"/><meta http-equiv="X-UA-Compatible" content="IE=edge, chrome=1"/><title>VirtualizedList · React Native</title><meta name="viewport" content="width=device-width"/><meta name="generator" content="Docusaurus"/><meta property="og:title" content="VirtualizedList · React Native"/><meta property="og:type" content="website"/><meta property="og:url" content="https://facebook.github.io/react-native/index.html"/><meta property="og:description" content="Base implementation for the more convenient [`&lt;FlatList&gt;`](/react-native/docs/0.25/flatlist.html) and [`&lt;SectionList&gt;`](/react-native/docs/0.25/sectionlist.html) components, which are also better documented. In general, this should only really be used if you need more flexibility than `FlatList` provides, e.g. for use with immutable data instead of plain arrays."/><link rel="shortcut icon" href="/react-native/img/favicon.png"/><link rel="stylesheet" href="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.css"/><link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/solarized-dark.min.css"/><link rel="alternate" type="application/atom+xml" href="https://facebook.github.io/blog/atom.xml" title="React Native Blog ATOM Feed"/><link rel="alternate" type="application/rss+xml" href="https://facebook.github.io/blog/feed.xml" title="React Native Blog RSS Feed"/><script type="text/javascript" src="https://snack.expo.io/embed.js"></script><script type="text/javascript" src="/react-native/js/codeblocks.js"></script><link rel="stylesheet" href="/react-native/css/main.css"/></head><body class="sideNavVisible"><div class="fixedHeaderContainer"><div class="headerWrapper wrapper"><header><a href="/react-native/"><img class="logo" src="/react-native/img/header_logo.png"/><h2 class="headerTitle">React Native</h2></a><a href="/react-native/versions.html"><h3>0.25</h3></a><div class="navigationWrapper navigationSlider"><nav class="slidingNav"><ul class="nav-site nav-site-internal"><li><a href="/react-native/docs/0.25/getting-started.html" target="_self">Docs</a></li><li><a href="/react-native/en/help.html" target="_self">Community</a></li><li><a href="/react-native/blog" target="_self">Blog</a></li><li class="navSearchWrapper reactNavSearchWrapper"><input type="text" id="search_input_react" placeholder="Search"/></li><li><a href="https://github.com/facebook/react-native" target="_self">GitHub</a></li><li><a href="https://reactjs.org/" target="_self">React</a></li></ul></nav></div></header></div></div><div class="navPusher"><div class="docMainWrapper wrapper"><div class="container mainContainer"><div class="wrapper"><div class="post"><header class="postHeader"><a class="edit-page-link button" href="https://github.com/facebook/react-native-website/blob/master/website/versioned_docs/version-0.5/virtualizedlist.md" target="_blank">Edit</a><h1>VirtualizedList</h1></header><article><div><span><p>Base implementation for the more convenient <a href="/react-native/docs/0.25/flatlist.html"><code>&lt;FlatList&gt;</code></a> and <a href="/react-native/docs/0.25/sectionlist.html"><code>&lt;SectionList&gt;</code></a> components, which are also better documented. In general, this should only really be used if you need more flexibility than <code>FlatList</code> provides, e.g. for use with immutable data instead of plain arrays.</p>
<p>Virtualization massively improves memory consumption and performance of large lists by maintaining a finite render window of active items and replacing all items outside of the render window with appropriately sized blank space. The window adapts to scrolling behavior, and items are rendered incrementally with low-pri (after any running interactions) if they are far from the visible area, or with hi-pri otherwise to minimize the potential of seeing blank space.</p>
<p>Some caveats:</p>
<ul>
docs/0.26/sectionlist.html
+1 -1
View File
@@ -12,7 +12,7 @@
<li>Scroll loading.</li>
</ul>
<p>If you don't need section support and want a simpler interface, use
<a href="/react-native/flatlist.md"><code>&lt;FlatList&gt;</code></a>.</p>
<a href="/react-native/docs/0.26/flatlist.html"><code>&lt;FlatList&gt;</code></a>.</p>
<p>Simple Examples:</p>
<pre><code class="hljs css javascript">&lt;SectionList
renderItem={({item}) =&gt; &lt;ListItem title={item} /&gt;}
docs/0.26/virtualizedlist.html
+1 -1
View File
@@ -1,4 +1,4 @@
<html><head><meta charset="utf-8"/><meta http-equiv="X-UA-Compatible" content="IE=edge, chrome=1"/><title>VirtualizedList · React Native</title><meta name="viewport" content="width=device-width"/><meta name="generator" content="Docusaurus"/><meta property="og:title" content="VirtualizedList · React Native"/><meta property="og:type" content="website"/><meta property="og:url" content="https://facebook.github.io/react-native/index.html"/><meta property="og:description" content="Base implementation for the more convenient [`&lt;FlatList&gt;`](/react-native/flatlist.md) and [`&lt;SectionList&gt;`](/react-native/sectionlist.md) components, which are also better documented. In general, this should only really be used if you need more flexibility than `FlatList` provides, e.g. for use with immutable data instead of plain arrays."/><link rel="shortcut icon" href="/react-native/img/favicon.png"/><link rel="stylesheet" href="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.css"/><link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/solarized-dark.min.css"/><link rel="alternate" type="application/atom+xml" href="https://facebook.github.io/blog/atom.xml" title="React Native Blog ATOM Feed"/><link rel="alternate" type="application/rss+xml" href="https://facebook.github.io/blog/feed.xml" title="React Native Blog RSS Feed"/><script type="text/javascript" src="https://snack.expo.io/embed.js"></script><script type="text/javascript" src="/react-native/js/codeblocks.js"></script><link rel="stylesheet" href="/react-native/css/main.css"/></head><body class="sideNavVisible"><div class="fixedHeaderContainer"><div class="headerWrapper wrapper"><header><a href="/react-native/"><img class="logo" src="/react-native/img/header_logo.png"/><h2 class="headerTitle">React Native</h2></a><a href="/react-native/versions.html"><h3>0.26</h3></a><div class="navigationWrapper navigationSlider"><nav class="slidingNav"><ul class="nav-site nav-site-internal"><li><a href="/react-native/docs/0.26/getting-started.html" target="_self">Docs</a></li><li><a href="/react-native/en/help.html" target="_self">Community</a></li><li><a href="/react-native/blog" target="_self">Blog</a></li><li class="navSearchWrapper reactNavSearchWrapper"><input type="text" id="search_input_react" placeholder="Search"/></li><li><a href="https://github.com/facebook/react-native" target="_self">GitHub</a></li><li><a href="https://reactjs.org/" target="_self">React</a></li></ul></nav></div></header></div></div><div class="navPusher"><div class="docMainWrapper wrapper"><div class="container mainContainer"><div class="wrapper"><div class="post"><header class="postHeader"><a class="edit-page-link button" href="https://github.com/facebook/react-native-website/blob/master/website/versioned_docs/version-0.5/virtualizedlist.md" target="_blank">Edit</a><h1>VirtualizedList</h1></header><article><div><span><p>Base implementation for the more convenient <a href="/react-native/flatlist.md"><code>&lt;FlatList&gt;</code></a> and <a href="/react-native/sectionlist.md"><code>&lt;SectionList&gt;</code></a> components, which are also better documented. In general, this should only really be used if you need more flexibility than <code>FlatList</code> provides, e.g. for use with immutable data instead of plain arrays.</p>
<html><head><meta charset="utf-8"/><meta http-equiv="X-UA-Compatible" content="IE=edge, chrome=1"/><title>VirtualizedList · React Native</title><meta name="viewport" content="width=device-width"/><meta name="generator" content="Docusaurus"/><meta property="og:title" content="VirtualizedList · React Native"/><meta property="og:type" content="website"/><meta property="og:url" content="https://facebook.github.io/react-native/index.html"/><meta property="og:description" content="Base implementation for the more convenient [`&lt;FlatList&gt;`](/react-native/docs/0.26/flatlist.html) and [`&lt;SectionList&gt;`](/react-native/docs/0.26/sectionlist.html) components, which are also better documented. In general, this should only really be used if you need more flexibility than `FlatList` provides, e.g. for use with immutable data instead of plain arrays."/><link rel="shortcut icon" href="/react-native/img/favicon.png"/><link rel="stylesheet" href="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.css"/><link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/solarized-dark.min.css"/><link rel="alternate" type="application/atom+xml" href="https://facebook.github.io/blog/atom.xml" title="React Native Blog ATOM Feed"/><link rel="alternate" type="application/rss+xml" href="https://facebook.github.io/blog/feed.xml" title="React Native Blog RSS Feed"/><script type="text/javascript" src="https://snack.expo.io/embed.js"></script><script type="text/javascript" src="/react-native/js/codeblocks.js"></script><link rel="stylesheet" href="/react-native/css/main.css"/></head><body class="sideNavVisible"><div class="fixedHeaderContainer"><div class="headerWrapper wrapper"><header><a href="/react-native/"><img class="logo" src="/react-native/img/header_logo.png"/><h2 class="headerTitle">React Native</h2></a><a href="/react-native/versions.html"><h3>0.26</h3></a><div class="navigationWrapper navigationSlider"><nav class="slidingNav"><ul class="nav-site nav-site-internal"><li><a href="/react-native/docs/0.26/getting-started.html" target="_self">Docs</a></li><li><a href="/react-native/en/help.html" target="_self">Community</a></li><li><a href="/react-native/blog" target="_self">Blog</a></li><li class="navSearchWrapper reactNavSearchWrapper"><input type="text" id="search_input_react" placeholder="Search"/></li><li><a href="https://github.com/facebook/react-native" target="_self">GitHub</a></li><li><a href="https://reactjs.org/" target="_self">React</a></li></ul></nav></div></header></div></div><div class="navPusher"><div class="docMainWrapper wrapper"><div class="container mainContainer"><div class="wrapper"><div class="post"><header class="postHeader"><a class="edit-page-link button" href="https://github.com/facebook/react-native-website/blob/master/website/versioned_docs/version-0.5/virtualizedlist.md" target="_blank">Edit</a><h1>VirtualizedList</h1></header><article><div><span><p>Base implementation for the more convenient <a href="/react-native/docs/0.26/flatlist.html"><code>&lt;FlatList&gt;</code></a> and <a href="/react-native/docs/0.26/sectionlist.html"><code>&lt;SectionList&gt;</code></a> components, which are also better documented. In general, this should only really be used if you need more flexibility than <code>FlatList</code> provides, e.g. for use with immutable data instead of plain arrays.</p>
<p>Virtualization massively improves memory consumption and performance of large lists by maintaining a finite render window of active items and replacing all items outside of the render window with appropriately sized blank space. The window adapts to scrolling behavior, and items are rendered incrementally with low-pri (after any running interactions) if they are far from the visible area, or with hi-pri otherwise to minimize the potential of seeing blank space.</p>
<p>Some caveats:</p>
<ul>
docs/0.27/sectionlist.html
+1 -1
View File
@@ -12,7 +12,7 @@
<li>Scroll loading.</li>
</ul>
<p>If you don't need section support and want a simpler interface, use
<a href="/react-native/flatlist.md"><code>&lt;FlatList&gt;</code></a>.</p>
<a href="/react-native/docs/0.27/flatlist.html"><code>&lt;FlatList&gt;</code></a>.</p>
<p>Simple Examples:</p>
<pre><code class="hljs css javascript">&lt;SectionList
renderItem={({item}) =&gt; &lt;ListItem title={item} /&gt;}
docs/0.27/virtualizedlist.html
+1 -1
View File
@@ -1,4 +1,4 @@
<html><head><meta charset="utf-8"/><meta http-equiv="X-UA-Compatible" content="IE=edge, chrome=1"/><title>VirtualizedList · React Native</title><meta name="viewport" content="width=device-width"/><meta name="generator" content="Docusaurus"/><meta property="og:title" content="VirtualizedList · React Native"/><meta property="og:type" content="website"/><meta property="og:url" content="https://facebook.github.io/react-native/index.html"/><meta property="og:description" content="Base implementation for the more convenient [`&lt;FlatList&gt;`](/react-native/flatlist.md) and [`&lt;SectionList&gt;`](/react-native/sectionlist.md) components, which are also better documented. In general, this should only really be used if you need more flexibility than `FlatList` provides, e.g. for use with immutable data instead of plain arrays."/><link rel="shortcut icon" href="/react-native/img/favicon.png"/><link rel="stylesheet" href="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.css"/><link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/solarized-dark.min.css"/><link rel="alternate" type="application/atom+xml" href="https://facebook.github.io/blog/atom.xml" title="React Native Blog ATOM Feed"/><link rel="alternate" type="application/rss+xml" href="https://facebook.github.io/blog/feed.xml" title="React Native Blog RSS Feed"/><script type="text/javascript" src="https://snack.expo.io/embed.js"></script><script type="text/javascript" src="/react-native/js/codeblocks.js"></script><link rel="stylesheet" href="/react-native/css/main.css"/></head><body class="sideNavVisible"><div class="fixedHeaderContainer"><div class="headerWrapper wrapper"><header><a href="/react-native/"><img class="logo" src="/react-native/img/header_logo.png"/><h2 class="headerTitle">React Native</h2></a><a href="/react-native/versions.html"><h3>0.27</h3></a><div class="navigationWrapper navigationSlider"><nav class="slidingNav"><ul class="nav-site nav-site-internal"><li><a href="/react-native/docs/0.27/getting-started.html" target="_self">Docs</a></li><li><a href="/react-native/en/help.html" target="_self">Community</a></li><li><a href="/react-native/blog" target="_self">Blog</a></li><li class="navSearchWrapper reactNavSearchWrapper"><input type="text" id="search_input_react" placeholder="Search"/></li><li><a href="https://github.com/facebook/react-native" target="_self">GitHub</a></li><li><a href="https://reactjs.org/" target="_self">React</a></li></ul></nav></div></header></div></div><div class="navPusher"><div class="docMainWrapper wrapper"><div class="container mainContainer"><div class="wrapper"><div class="post"><header class="postHeader"><a class="edit-page-link button" href="https://github.com/facebook/react-native-website/blob/master/website/versioned_docs/version-0.5/virtualizedlist.md" target="_blank">Edit</a><h1>VirtualizedList</h1></header><article><div><span><p>Base implementation for the more convenient <a href="/react-native/flatlist.md"><code>&lt;FlatList&gt;</code></a> and <a href="/react-native/sectionlist.md"><code>&lt;SectionList&gt;</code></a> components, which are also better documented. In general, this should only really be used if you need more flexibility than <code>FlatList</code> provides, e.g. for use with immutable data instead of plain arrays.</p>
<html><head><meta charset="utf-8"/><meta http-equiv="X-UA-Compatible" content="IE=edge, chrome=1"/><title>VirtualizedList · React Native</title><meta name="viewport" content="width=device-width"/><meta name="generator" content="Docusaurus"/><meta property="og:title" content="VirtualizedList · React Native"/><meta property="og:type" content="website"/><meta property="og:url" content="https://facebook.github.io/react-native/index.html"/><meta property="og:description" content="Base implementation for the more convenient [`&lt;FlatList&gt;`](/react-native/docs/0.27/flatlist.html) and [`&lt;SectionList&gt;`](/react-native/docs/0.27/sectionlist.html) components, which are also better documented. In general, this should only really be used if you need more flexibility than `FlatList` provides, e.g. for use with immutable data instead of plain arrays."/><link rel="shortcut icon" href="/react-native/img/favicon.png"/><link rel="stylesheet" href="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.css"/><link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/solarized-dark.min.css"/><link rel="alternate" type="application/atom+xml" href="https://facebook.github.io/blog/atom.xml" title="React Native Blog ATOM Feed"/><link rel="alternate" type="application/rss+xml" href="https://facebook.github.io/blog/feed.xml" title="React Native Blog RSS Feed"/><script type="text/javascript" src="https://snack.expo.io/embed.js"></script><script type="text/javascript" src="/react-native/js/codeblocks.js"></script><link rel="stylesheet" href="/react-native/css/main.css"/></head><body class="sideNavVisible"><div class="fixedHeaderContainer"><div class="headerWrapper wrapper"><header><a href="/react-native/"><img class="logo" src="/react-native/img/header_logo.png"/><h2 class="headerTitle">React Native</h2></a><a href="/react-native/versions.html"><h3>0.27</h3></a><div class="navigationWrapper navigationSlider"><nav class="slidingNav"><ul class="nav-site nav-site-internal"><li><a href="/react-native/docs/0.27/getting-started.html" target="_self">Docs</a></li><li><a href="/react-native/en/help.html" target="_self">Community</a></li><li><a href="/react-native/blog" target="_self">Blog</a></li><li class="navSearchWrapper reactNavSearchWrapper"><input type="text" id="search_input_react" placeholder="Search"/></li><li><a href="https://github.com/facebook/react-native" target="_self">GitHub</a></li><li><a href="https://reactjs.org/" target="_self">React</a></li></ul></nav></div></header></div></div><div class="navPusher"><div class="docMainWrapper wrapper"><div class="container mainContainer"><div class="wrapper"><div class="post"><header class="postHeader"><a class="edit-page-link button" href="https://github.com/facebook/react-native-website/blob/master/website/versioned_docs/version-0.5/virtualizedlist.md" target="_blank">Edit</a><h1>VirtualizedList</h1></header><article><div><span><p>Base implementation for the more convenient <a href="/react-native/docs/0.27/flatlist.html"><code>&lt;FlatList&gt;</code></a> and <a href="/react-native/docs/0.27/sectionlist.html"><code>&lt;SectionList&gt;</code></a> components, which are also better documented. In general, this should only really be used if you need more flexibility than <code>FlatList</code> provides, e.g. for use with immutable data instead of plain arrays.</p>
<p>Virtualization massively improves memory consumption and performance of large lists by maintaining a finite render window of active items and replacing all items outside of the render window with appropriately sized blank space. The window adapts to scrolling behavior, and items are rendered incrementally with low-pri (after any running interactions) if they are far from the visible area, or with hi-pri otherwise to minimize the potential of seeing blank space.</p>
<p>Some caveats:</p>
<ul>
docs/0.28/sectionlist.html
+1 -1
View File
@@ -12,7 +12,7 @@
<li>Scroll loading.</li>
</ul>
<p>If you don't need section support and want a simpler interface, use
<a href="/react-native/flatlist.md"><code>&lt;FlatList&gt;</code></a>.</p>
<a href="/react-native/docs/0.28/flatlist.html"><code>&lt;FlatList&gt;</code></a>.</p>
<p>Simple Examples:</p>
<pre><code class="hljs css javascript">&lt;SectionList
renderItem={({item}) =&gt; &lt;ListItem title={item} /&gt;}
docs/0.28/virtualizedlist.html
+1 -1
View File
@@ -1,4 +1,4 @@
<html><head><meta charset="utf-8"/><meta http-equiv="X-UA-Compatible" content="IE=edge, chrome=1"/><title>VirtualizedList · React Native</title><meta name="viewport" content="width=device-width"/><meta name="generator" content="Docusaurus"/><meta property="og:title" content="VirtualizedList · React Native"/><meta property="og:type" content="website"/><meta property="og:url" content="https://facebook.github.io/react-native/index.html"/><meta property="og:description" content="Base implementation for the more convenient [`&lt;FlatList&gt;`](/react-native/flatlist.md) and [`&lt;SectionList&gt;`](/react-native/sectionlist.md) components, which are also better documented. In general, this should only really be used if you need more flexibility than `FlatList` provides, e.g. for use with immutable data instead of plain arrays."/><link rel="shortcut icon" href="/react-native/img/favicon.png"/><link rel="stylesheet" href="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.css"/><link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/solarized-dark.min.css"/><link rel="alternate" type="application/atom+xml" href="https://facebook.github.io/blog/atom.xml" title="React Native Blog ATOM Feed"/><link rel="alternate" type="application/rss+xml" href="https://facebook.github.io/blog/feed.xml" title="React Native Blog RSS Feed"/><script type="text/javascript" src="https://snack.expo.io/embed.js"></script><script type="text/javascript" src="/react-native/js/codeblocks.js"></script><link rel="stylesheet" href="/react-native/css/main.css"/></head><body class="sideNavVisible"><div class="fixedHeaderContainer"><div class="headerWrapper wrapper"><header><a href="/react-native/"><img class="logo" src="/react-native/img/header_logo.png"/><h2 class="headerTitle">React Native</h2></a><a href="/react-native/versions.html"><h3>0.28</h3></a><div class="navigationWrapper navigationSlider"><nav class="slidingNav"><ul class="nav-site nav-site-internal"><li><a href="/react-native/docs/0.28/getting-started.html" target="_self">Docs</a></li><li><a href="/react-native/en/help.html" target="_self">Community</a></li><li><a href="/react-native/blog" target="_self">Blog</a></li><li class="navSearchWrapper reactNavSearchWrapper"><input type="text" id="search_input_react" placeholder="Search"/></li><li><a href="https://github.com/facebook/react-native" target="_self">GitHub</a></li><li><a href="https://reactjs.org/" target="_self">React</a></li></ul></nav></div></header></div></div><div class="navPusher"><div class="docMainWrapper wrapper"><div class="container mainContainer"><div class="wrapper"><div class="post"><header class="postHeader"><a class="edit-page-link button" href="https://github.com/facebook/react-native-website/blob/master/website/versioned_docs/version-0.5/virtualizedlist.md" target="_blank">Edit</a><h1>VirtualizedList</h1></header><article><div><span><p>Base implementation for the more convenient <a href="/react-native/flatlist.md"><code>&lt;FlatList&gt;</code></a> and <a href="/react-native/sectionlist.md"><code>&lt;SectionList&gt;</code></a> components, which are also better documented. In general, this should only really be used if you need more flexibility than <code>FlatList</code> provides, e.g. for use with immutable data instead of plain arrays.</p>
<html><head><meta charset="utf-8"/><meta http-equiv="X-UA-Compatible" content="IE=edge, chrome=1"/><title>VirtualizedList · React Native</title><meta name="viewport" content="width=device-width"/><meta name="generator" content="Docusaurus"/><meta property="og:title" content="VirtualizedList · React Native"/><meta property="og:type" content="website"/><meta property="og:url" content="https://facebook.github.io/react-native/index.html"/><meta property="og:description" content="Base implementation for the more convenient [`&lt;FlatList&gt;`](/react-native/docs/0.28/flatlist.html) and [`&lt;SectionList&gt;`](/react-native/docs/0.28/sectionlist.html) components, which are also better documented. In general, this should only really be used if you need more flexibility than `FlatList` provides, e.g. for use with immutable data instead of plain arrays."/><link rel="shortcut icon" href="/react-native/img/favicon.png"/><link rel="stylesheet" href="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.css"/><link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/solarized-dark.min.css"/><link rel="alternate" type="application/atom+xml" href="https://facebook.github.io/blog/atom.xml" title="React Native Blog ATOM Feed"/><link rel="alternate" type="application/rss+xml" href="https://facebook.github.io/blog/feed.xml" title="React Native Blog RSS Feed"/><script type="text/javascript" src="https://snack.expo.io/embed.js"></script><script type="text/javascript" src="/react-native/js/codeblocks.js"></script><link rel="stylesheet" href="/react-native/css/main.css"/></head><body class="sideNavVisible"><div class="fixedHeaderContainer"><div class="headerWrapper wrapper"><header><a href="/react-native/"><img class="logo" src="/react-native/img/header_logo.png"/><h2 class="headerTitle">React Native</h2></a><a href="/react-native/versions.html"><h3>0.28</h3></a><div class="navigationWrapper navigationSlider"><nav class="slidingNav"><ul class="nav-site nav-site-internal"><li><a href="/react-native/docs/0.28/getting-started.html" target="_self">Docs</a></li><li><a href="/react-native/en/help.html" target="_self">Community</a></li><li><a href="/react-native/blog" target="_self">Blog</a></li><li class="navSearchWrapper reactNavSearchWrapper"><input type="text" id="search_input_react" placeholder="Search"/></li><li><a href="https://github.com/facebook/react-native" target="_self">GitHub</a></li><li><a href="https://reactjs.org/" target="_self">React</a></li></ul></nav></div></header></div></div><div class="navPusher"><div class="docMainWrapper wrapper"><div class="container mainContainer"><div class="wrapper"><div class="post"><header class="postHeader"><a class="edit-page-link button" href="https://github.com/facebook/react-native-website/blob/master/website/versioned_docs/version-0.5/virtualizedlist.md" target="_blank">Edit</a><h1>VirtualizedList</h1></header><article><div><span><p>Base implementation for the more convenient <a href="/react-native/docs/0.28/flatlist.html"><code>&lt;FlatList&gt;</code></a> and <a href="/react-native/docs/0.28/sectionlist.html"><code>&lt;SectionList&gt;</code></a> components, which are also better documented. In general, this should only really be used if you need more flexibility than <code>FlatList</code> provides, e.g. for use with immutable data instead of plain arrays.</p>
<p>Virtualization massively improves memory consumption and performance of large lists by maintaining a finite render window of active items and replacing all items outside of the render window with appropriately sized blank space. The window adapts to scrolling behavior, and items are rendered incrementally with low-pri (after any running interactions) if they are far from the visible area, or with hi-pri otherwise to minimize the potential of seeing blank space.</p>
<p>Some caveats:</p>
<ul>
docs/0.29/modal.html
+1 -1
View File
@@ -6,7 +6,7 @@
};
</script></nav></div><div class="container mainContainer"><div class="wrapper"><div class="post"><header class="postHeader"><a class="edit-page-link button" href="https://github.com/facebook/react-native-website/blob/master/website/versioned_docs/version-0.29/modal.md" target="_blank">Edit</a><h1>Modal</h1></header><article><div><span><p>The Modal component is a simple way to present content above an enclosing view.</p>
<p><em>Note: If you need more control over how to present modals over the rest of your app,
then consider using a top-level Navigator. Go <a href="/react-native/navigator-comparison.md">here</a> to compare navigation options.</em></p>
then consider using a top-level Navigator. Go <a href="navigator-comparison.md">here</a> to compare navigation options.</em></p>
<pre><code class="hljs css javascript"><span class="hljs-keyword">import</span> React, { Component } <span class="hljs-keyword">from</span> <span class="hljs-string">'react'</span>;
<span class="hljs-keyword">import</span> { Modal, Text, TouchableHighlight, View } <span class="hljs-keyword">from</span> <span class="hljs-string">'react-native'</span>;
docs/0.29/sectionlist.html
+1 -1
View File
@@ -12,7 +12,7 @@
<li>Scroll loading.</li>
</ul>
<p>If you don't need section support and want a simpler interface, use
<a href="/react-native/flatlist.md"><code>&lt;FlatList&gt;</code></a>.</p>
<a href="/react-native/docs/0.29/flatlist.html"><code>&lt;FlatList&gt;</code></a>.</p>
<p>Simple Examples:</p>
<pre><code class="hljs css javascript">&lt;SectionList
renderItem={({item}) =&gt; &lt;ListItem title={item} /&gt;}
docs/0.29/text.html
+1 -1
View File
@@ -82,7 +82,7 @@ AppRegistry.registerComponent(<span class="hljs-string">'TextInANest'</span>, ()
<p>When set to <code>true</code>, indicates that the view is an accessibility element. The default value
for a <code>Text</code> element is <code>true</code>.</p>
<p>See the
<a href="/react-native/accessibility.md#accessible-ios-android">Accessibility guide</a>
<a href="/react-native/docs/0.29/accessibility.html#accessible-ios-android">Accessibility guide</a>
for more information.</p>
<table>
<thead>
docs/0.29/textinput.html
+1 -1
View File
@@ -449,7 +449,7 @@ like passwords stay secure. The default value is <code>false</code>.</p>
</table>
<hr>
<h3><a class="anchor" aria-hidden="true" name="style"></a><a href="#style" aria-hidden="true" class="hash-link" ><svg aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a><code>style</code></h3>
<p><a href="/react-native/style.md">Styles</a></p>
<p><a href="/react-native/docs/0.29/style.html">Styles</a></p>
<table>
<thead>
<tr><th>Type</th><th>Required</th></tr>
docs/0.29/virtualizedlist.html
+1 -1
View File
@@ -1,4 +1,4 @@
<html><head><meta charset="utf-8"/><meta http-equiv="X-UA-Compatible" content="IE=edge, chrome=1"/><title>VirtualizedList · React Native</title><meta name="viewport" content="width=device-width"/><meta name="generator" content="Docusaurus"/><meta property="og:title" content="VirtualizedList · React Native"/><meta property="og:type" content="website"/><meta property="og:url" content="https://facebook.github.io/react-native/index.html"/><meta property="og:description" content="Base implementation for the more convenient [`&lt;FlatList&gt;`](/react-native/flatlist.md) and [`&lt;SectionList&gt;`](/react-native/sectionlist.md) components, which are also better documented. In general, this should only really be used if you need more flexibility than `FlatList` provides, e.g. for use with immutable data instead of plain arrays."/><link rel="shortcut icon" href="/react-native/img/favicon.png"/><link rel="stylesheet" href="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.css"/><link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/solarized-dark.min.css"/><link rel="alternate" type="application/atom+xml" href="https://facebook.github.io/blog/atom.xml" title="React Native Blog ATOM Feed"/><link rel="alternate" type="application/rss+xml" href="https://facebook.github.io/blog/feed.xml" title="React Native Blog RSS Feed"/><script type="text/javascript" src="https://snack.expo.io/embed.js"></script><script type="text/javascript" src="/react-native/js/codeblocks.js"></script><link rel="stylesheet" href="/react-native/css/main.css"/></head><body class="sideNavVisible"><div class="fixedHeaderContainer"><div class="headerWrapper wrapper"><header><a href="/react-native/"><img class="logo" src="/react-native/img/header_logo.png"/><h2 class="headerTitle">React Native</h2></a><a href="/react-native/versions.html"><h3>0.29</h3></a><div class="navigationWrapper navigationSlider"><nav class="slidingNav"><ul class="nav-site nav-site-internal"><li><a href="/react-native/docs/0.29/getting-started.html" target="_self">Docs</a></li><li><a href="/react-native/en/help.html" target="_self">Community</a></li><li><a href="/react-native/blog" target="_self">Blog</a></li><li class="navSearchWrapper reactNavSearchWrapper"><input type="text" id="search_input_react" placeholder="Search"/></li><li><a href="https://github.com/facebook/react-native" target="_self">GitHub</a></li><li><a href="https://reactjs.org/" target="_self">React</a></li></ul></nav></div></header></div></div><div class="navPusher"><div class="docMainWrapper wrapper"><div class="container mainContainer"><div class="wrapper"><div class="post"><header class="postHeader"><a class="edit-page-link button" href="https://github.com/facebook/react-native-website/blob/master/website/versioned_docs/version-0.5/virtualizedlist.md" target="_blank">Edit</a><h1>VirtualizedList</h1></header><article><div><span><p>Base implementation for the more convenient <a href="/react-native/flatlist.md"><code>&lt;FlatList&gt;</code></a> and <a href="/react-native/sectionlist.md"><code>&lt;SectionList&gt;</code></a> components, which are also better documented. In general, this should only really be used if you need more flexibility than <code>FlatList</code> provides, e.g. for use with immutable data instead of plain arrays.</p>
<html><head><meta charset="utf-8"/><meta http-equiv="X-UA-Compatible" content="IE=edge, chrome=1"/><title>VirtualizedList · React Native</title><meta name="viewport" content="width=device-width"/><meta name="generator" content="Docusaurus"/><meta property="og:title" content="VirtualizedList · React Native"/><meta property="og:type" content="website"/><meta property="og:url" content="https://facebook.github.io/react-native/index.html"/><meta property="og:description" content="Base implementation for the more convenient [`&lt;FlatList&gt;`](/react-native/docs/0.29/flatlist.html) and [`&lt;SectionList&gt;`](/react-native/docs/0.29/sectionlist.html) components, which are also better documented. In general, this should only really be used if you need more flexibility than `FlatList` provides, e.g. for use with immutable data instead of plain arrays."/><link rel="shortcut icon" href="/react-native/img/favicon.png"/><link rel="stylesheet" href="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.css"/><link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/solarized-dark.min.css"/><link rel="alternate" type="application/atom+xml" href="https://facebook.github.io/blog/atom.xml" title="React Native Blog ATOM Feed"/><link rel="alternate" type="application/rss+xml" href="https://facebook.github.io/blog/feed.xml" title="React Native Blog RSS Feed"/><script type="text/javascript" src="https://snack.expo.io/embed.js"></script><script type="text/javascript" src="/react-native/js/codeblocks.js"></script><link rel="stylesheet" href="/react-native/css/main.css"/></head><body class="sideNavVisible"><div class="fixedHeaderContainer"><div class="headerWrapper wrapper"><header><a href="/react-native/"><img class="logo" src="/react-native/img/header_logo.png"/><h2 class="headerTitle">React Native</h2></a><a href="/react-native/versions.html"><h3>0.29</h3></a><div class="navigationWrapper navigationSlider"><nav class="slidingNav"><ul class="nav-site nav-site-internal"><li><a href="/react-native/docs/0.29/getting-started.html" target="_self">Docs</a></li><li><a href="/react-native/en/help.html" target="_self">Community</a></li><li><a href="/react-native/blog" target="_self">Blog</a></li><li class="navSearchWrapper reactNavSearchWrapper"><input type="text" id="search_input_react" placeholder="Search"/></li><li><a href="https://github.com/facebook/react-native" target="_self">GitHub</a></li><li><a href="https://reactjs.org/" target="_self">React</a></li></ul></nav></div></header></div></div><div class="navPusher"><div class="docMainWrapper wrapper"><div class="container mainContainer"><div class="wrapper"><div class="post"><header class="postHeader"><a class="edit-page-link button" href="https://github.com/facebook/react-native-website/blob/master/website/versioned_docs/version-0.5/virtualizedlist.md" target="_blank">Edit</a><h1>VirtualizedList</h1></header><article><div><span><p>Base implementation for the more convenient <a href="/react-native/docs/0.29/flatlist.html"><code>&lt;FlatList&gt;</code></a> and <a href="/react-native/docs/0.29/sectionlist.html"><code>&lt;SectionList&gt;</code></a> components, which are also better documented. In general, this should only really be used if you need more flexibility than <code>FlatList</code> provides, e.g. for use with immutable data instead of plain arrays.</p>
<p>Virtualization massively improves memory consumption and performance of large lists by maintaining a finite render window of active items and replacing all items outside of the render window with appropriately sized blank space. The window adapts to scrolling behavior, and items are rendered incrementally with low-pri (after any running interactions) if they are far from the visible area, or with hi-pri otherwise to minimize the potential of seeing blank space.</p>
<p>Some caveats:</p>
<ul>
docs/0.30/modal.html
+1 -1
View File
@@ -6,7 +6,7 @@
};
</script></nav></div><div class="container mainContainer"><div class="wrapper"><div class="post"><header class="postHeader"><a class="edit-page-link button" href="https://github.com/facebook/react-native-website/blob/master/website/versioned_docs/version-0.30/modal.md" target="_blank">Edit</a><h1>Modal</h1></header><article><div><span><p>The Modal component is a simple way to present content above an enclosing view.</p>
<p><em>Note: If you need more control over how to present modals over the rest of your app,
then consider using a top-level Navigator. Go <a href="/react-native/navigator-comparison.md">here</a> to compare navigation options.</em></p>
then consider using a top-level Navigator. Go <a href="navigator-comparison.md">here</a> to compare navigation options.</em></p>
<pre><code class="hljs css javascript"><span class="hljs-keyword">import</span> React, { Component } <span class="hljs-keyword">from</span> <span class="hljs-string">'react'</span>;
<span class="hljs-keyword">import</span> { Modal, Text, TouchableHighlight, View } <span class="hljs-keyword">from</span> <span class="hljs-string">'react-native'</span>;
docs/0.30/sectionlist.html
+1 -1
View File
@@ -12,7 +12,7 @@
<li>Scroll loading.</li>
</ul>
<p>If you don't need section support and want a simpler interface, use
<a href="/react-native/flatlist.md"><code>&lt;FlatList&gt;</code></a>.</p>
<a href="/react-native/docs/0.30/flatlist.html"><code>&lt;FlatList&gt;</code></a>.</p>
<p>Simple Examples:</p>
<pre><code class="hljs css javascript">&lt;SectionList
renderItem={({item}) =&gt; &lt;ListItem title={item} /&gt;}
docs/0.30/textinput.html
+1 -1
View File
@@ -489,7 +489,7 @@ like passwords stay secure. The default value is <code>false</code>.</p>
</table>
<hr>
<h3><a class="anchor" aria-hidden="true" name="style"></a><a href="#style" aria-hidden="true" class="hash-link" ><svg aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a><code>style</code></h3>
<p><a href="/react-native/style.md">Styles</a></p>
<p><a href="/react-native/docs/0.30/style.html">Styles</a></p>
<table>
<thead>
<tr><th>Type</th><th>Required</th></tr>
docs/0.30/virtualizedlist.html
+1 -1
View File
@@ -1,4 +1,4 @@
<html><head><meta charset="utf-8"/><meta http-equiv="X-UA-Compatible" content="IE=edge, chrome=1"/><title>VirtualizedList · React Native</title><meta name="viewport" content="width=device-width"/><meta name="generator" content="Docusaurus"/><meta property="og:title" content="VirtualizedList · React Native"/><meta property="og:type" content="website"/><meta property="og:url" content="https://facebook.github.io/react-native/index.html"/><meta property="og:description" content="Base implementation for the more convenient [`&lt;FlatList&gt;`](/react-native/flatlist.md) and [`&lt;SectionList&gt;`](/react-native/sectionlist.md) components, which are also better documented. In general, this should only really be used if you need more flexibility than `FlatList` provides, e.g. for use with immutable data instead of plain arrays."/><link rel="shortcut icon" href="/react-native/img/favicon.png"/><link rel="stylesheet" href="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.css"/><link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/solarized-dark.min.css"/><link rel="alternate" type="application/atom+xml" href="https://facebook.github.io/blog/atom.xml" title="React Native Blog ATOM Feed"/><link rel="alternate" type="application/rss+xml" href="https://facebook.github.io/blog/feed.xml" title="React Native Blog RSS Feed"/><script type="text/javascript" src="https://snack.expo.io/embed.js"></script><script type="text/javascript" src="/react-native/js/codeblocks.js"></script><link rel="stylesheet" href="/react-native/css/main.css"/></head><body class="sideNavVisible"><div class="fixedHeaderContainer"><div class="headerWrapper wrapper"><header><a href="/react-native/"><img class="logo" src="/react-native/img/header_logo.png"/><h2 class="headerTitle">React Native</h2></a><a href="/react-native/versions.html"><h3>0.30</h3></a><div class="navigationWrapper navigationSlider"><nav class="slidingNav"><ul class="nav-site nav-site-internal"><li><a href="/react-native/docs/0.30/getting-started.html" target="_self">Docs</a></li><li><a href="/react-native/en/help.html" target="_self">Community</a></li><li><a href="/react-native/blog" target="_self">Blog</a></li><li class="navSearchWrapper reactNavSearchWrapper"><input type="text" id="search_input_react" placeholder="Search"/></li><li><a href="https://github.com/facebook/react-native" target="_self">GitHub</a></li><li><a href="https://reactjs.org/" target="_self">React</a></li></ul></nav></div></header></div></div><div class="navPusher"><div class="docMainWrapper wrapper"><div class="container mainContainer"><div class="wrapper"><div class="post"><header class="postHeader"><a class="edit-page-link button" href="https://github.com/facebook/react-native-website/blob/master/website/versioned_docs/version-0.5/virtualizedlist.md" target="_blank">Edit</a><h1>VirtualizedList</h1></header><article><div><span><p>Base implementation for the more convenient <a href="/react-native/flatlist.md"><code>&lt;FlatList&gt;</code></a> and <a href="/react-native/sectionlist.md"><code>&lt;SectionList&gt;</code></a> components, which are also better documented. In general, this should only really be used if you need more flexibility than <code>FlatList</code> provides, e.g. for use with immutable data instead of plain arrays.</p>
<html><head><meta charset="utf-8"/><meta http-equiv="X-UA-Compatible" content="IE=edge, chrome=1"/><title>VirtualizedList · React Native</title><meta name="viewport" content="width=device-width"/><meta name="generator" content="Docusaurus"/><meta property="og:title" content="VirtualizedList · React Native"/><meta property="og:type" content="website"/><meta property="og:url" content="https://facebook.github.io/react-native/index.html"/><meta property="og:description" content="Base implementation for the more convenient [`&lt;FlatList&gt;`](/react-native/docs/0.30/flatlist.html) and [`&lt;SectionList&gt;`](/react-native/docs/0.30/sectionlist.html) components, which are also better documented. In general, this should only really be used if you need more flexibility than `FlatList` provides, e.g. for use with immutable data instead of plain arrays."/><link rel="shortcut icon" href="/react-native/img/favicon.png"/><link rel="stylesheet" href="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.css"/><link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/solarized-dark.min.css"/><link rel="alternate" type="application/atom+xml" href="https://facebook.github.io/blog/atom.xml" title="React Native Blog ATOM Feed"/><link rel="alternate" type="application/rss+xml" href="https://facebook.github.io/blog/feed.xml" title="React Native Blog RSS Feed"/><script type="text/javascript" src="https://snack.expo.io/embed.js"></script><script type="text/javascript" src="/react-native/js/codeblocks.js"></script><link rel="stylesheet" href="/react-native/css/main.css"/></head><body class="sideNavVisible"><div class="fixedHeaderContainer"><div class="headerWrapper wrapper"><header><a href="/react-native/"><img class="logo" src="/react-native/img/header_logo.png"/><h2 class="headerTitle">React Native</h2></a><a href="/react-native/versions.html"><h3>0.30</h3></a><div class="navigationWrapper navigationSlider"><nav class="slidingNav"><ul class="nav-site nav-site-internal"><li><a href="/react-native/docs/0.30/getting-started.html" target="_self">Docs</a></li><li><a href="/react-native/en/help.html" target="_self">Community</a></li><li><a href="/react-native/blog" target="_self">Blog</a></li><li class="navSearchWrapper reactNavSearchWrapper"><input type="text" id="search_input_react" placeholder="Search"/></li><li><a href="https://github.com/facebook/react-native" target="_self">GitHub</a></li><li><a href="https://reactjs.org/" target="_self">React</a></li></ul></nav></div></header></div></div><div class="navPusher"><div class="docMainWrapper wrapper"><div class="container mainContainer"><div class="wrapper"><div class="post"><header class="postHeader"><a class="edit-page-link button" href="https://github.com/facebook/react-native-website/blob/master/website/versioned_docs/version-0.5/virtualizedlist.md" target="_blank">Edit</a><h1>VirtualizedList</h1></header><article><div><span><p>Base implementation for the more convenient <a href="/react-native/docs/0.30/flatlist.html"><code>&lt;FlatList&gt;</code></a> and <a href="/react-native/docs/0.30/sectionlist.html"><code>&lt;SectionList&gt;</code></a> components, which are also better documented. In general, this should only really be used if you need more flexibility than <code>FlatList</code> provides, e.g. for use with immutable data instead of plain arrays.</p>
<p>Virtualization massively improves memory consumption and performance of large lists by maintaining a finite render window of active items and replacing all items outside of the render window with appropriately sized blank space. The window adapts to scrolling behavior, and items are rendered incrementally with low-pri (after any running interactions) if they are far from the visible area, or with hi-pri otherwise to minimize the potential of seeing blank space.</p>
<p>Some caveats:</p>
<ul>
docs/0.31/modal.html
+1 -1
View File
@@ -6,7 +6,7 @@
};
</script></nav></div><div class="container mainContainer"><div class="wrapper"><div class="post"><header class="postHeader"><a class="edit-page-link button" href="https://github.com/facebook/react-native-website/blob/master/website/versioned_docs/version-0.30/modal.md" target="_blank">Edit</a><h1>Modal</h1></header><article><div><span><p>The Modal component is a simple way to present content above an enclosing view.</p>
<p><em>Note: If you need more control over how to present modals over the rest of your app,
then consider using a top-level Navigator. Go <a href="/react-native/navigator-comparison.md">here</a> to compare navigation options.</em></p>
then consider using a top-level Navigator. Go <a href="navigator-comparison.md">here</a> to compare navigation options.</em></p>
<pre><code class="hljs css javascript"><span class="hljs-keyword">import</span> React, { Component } <span class="hljs-keyword">from</span> <span class="hljs-string">'react'</span>;
<span class="hljs-keyword">import</span> { Modal, Text, TouchableHighlight, View } <span class="hljs-keyword">from</span> <span class="hljs-string">'react-native'</span>;
docs/0.31/sectionlist.html
+1 -1
View File
@@ -12,7 +12,7 @@
<li>Scroll loading.</li>
</ul>
<p>If you don't need section support and want a simpler interface, use
<a href="/react-native/flatlist.md"><code>&lt;FlatList&gt;</code></a>.</p>
<a href="/react-native/docs/0.31/flatlist.html"><code>&lt;FlatList&gt;</code></a>.</p>
<p>Simple Examples:</p>
<pre><code class="hljs css javascript">&lt;SectionList
renderItem={({item}) =&gt; &lt;ListItem title={item} /&gt;}
docs/0.31/textinput.html
+1 -1
View File
@@ -504,7 +504,7 @@ like passwords stay secure. The default value is <code>false</code>.</p>
</table>
<hr>
<h3><a class="anchor" aria-hidden="true" name="style"></a><a href="#style" aria-hidden="true" class="hash-link" ><svg aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a><code>style</code></h3>
<p><a href="/react-native/style.md">Styles</a></p>
<p><a href="/react-native/docs/0.31/style.html">Styles</a></p>
<table>
<thead>
<tr><th>Type</th><th>Required</th></tr>
docs/0.31/virtualizedlist.html
+1 -1
View File
@@ -1,4 +1,4 @@
<html><head><meta charset="utf-8"/><meta http-equiv="X-UA-Compatible" content="IE=edge, chrome=1"/><title>VirtualizedList · React Native</title><meta name="viewport" content="width=device-width"/><meta name="generator" content="Docusaurus"/><meta property="og:title" content="VirtualizedList · React Native"/><meta property="og:type" content="website"/><meta property="og:url" content="https://facebook.github.io/react-native/index.html"/><meta property="og:description" content="Base implementation for the more convenient [`&lt;FlatList&gt;`](/react-native/flatlist.md) and [`&lt;SectionList&gt;`](/react-native/sectionlist.md) components, which are also better documented. In general, this should only really be used if you need more flexibility than `FlatList` provides, e.g. for use with immutable data instead of plain arrays."/><link rel="shortcut icon" href="/react-native/img/favicon.png"/><link rel="stylesheet" href="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.css"/><link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/solarized-dark.min.css"/><link rel="alternate" type="application/atom+xml" href="https://facebook.github.io/blog/atom.xml" title="React Native Blog ATOM Feed"/><link rel="alternate" type="application/rss+xml" href="https://facebook.github.io/blog/feed.xml" title="React Native Blog RSS Feed"/><script type="text/javascript" src="https://snack.expo.io/embed.js"></script><script type="text/javascript" src="/react-native/js/codeblocks.js"></script><link rel="stylesheet" href="/react-native/css/main.css"/></head><body class="sideNavVisible"><div class="fixedHeaderContainer"><div class="headerWrapper wrapper"><header><a href="/react-native/"><img class="logo" src="/react-native/img/header_logo.png"/><h2 class="headerTitle">React Native</h2></a><a href="/react-native/versions.html"><h3>0.31</h3></a><div class="navigationWrapper navigationSlider"><nav class="slidingNav"><ul class="nav-site nav-site-internal"><li><a href="/react-native/docs/0.31/getting-started.html" target="_self">Docs</a></li><li><a href="/react-native/en/help.html" target="_self">Community</a></li><li><a href="/react-native/blog" target="_self">Blog</a></li><li class="navSearchWrapper reactNavSearchWrapper"><input type="text" id="search_input_react" placeholder="Search"/></li><li><a href="https://github.com/facebook/react-native" target="_self">GitHub</a></li><li><a href="https://reactjs.org/" target="_self">React</a></li></ul></nav></div></header></div></div><div class="navPusher"><div class="docMainWrapper wrapper"><div class="container mainContainer"><div class="wrapper"><div class="post"><header class="postHeader"><a class="edit-page-link button" href="https://github.com/facebook/react-native-website/blob/master/website/versioned_docs/version-0.5/virtualizedlist.md" target="_blank">Edit</a><h1>VirtualizedList</h1></header><article><div><span><p>Base implementation for the more convenient <a href="/react-native/flatlist.md"><code>&lt;FlatList&gt;</code></a> and <a href="/react-native/sectionlist.md"><code>&lt;SectionList&gt;</code></a> components, which are also better documented. In general, this should only really be used if you need more flexibility than <code>FlatList</code> provides, e.g. for use with immutable data instead of plain arrays.</p>
<html><head><meta charset="utf-8"/><meta http-equiv="X-UA-Compatible" content="IE=edge, chrome=1"/><title>VirtualizedList · React Native</title><meta name="viewport" content="width=device-width"/><meta name="generator" content="Docusaurus"/><meta property="og:title" content="VirtualizedList · React Native"/><meta property="og:type" content="website"/><meta property="og:url" content="https://facebook.github.io/react-native/index.html"/><meta property="og:description" content="Base implementation for the more convenient [`&lt;FlatList&gt;`](/react-native/docs/0.31/flatlist.html) and [`&lt;SectionList&gt;`](/react-native/docs/0.31/sectionlist.html) components, which are also better documented. In general, this should only really be used if you need more flexibility than `FlatList` provides, e.g. for use with immutable data instead of plain arrays."/><link rel="shortcut icon" href="/react-native/img/favicon.png"/><link rel="stylesheet" href="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.css"/><link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/solarized-dark.min.css"/><link rel="alternate" type="application/atom+xml" href="https://facebook.github.io/blog/atom.xml" title="React Native Blog ATOM Feed"/><link rel="alternate" type="application/rss+xml" href="https://facebook.github.io/blog/feed.xml" title="React Native Blog RSS Feed"/><script type="text/javascript" src="https://snack.expo.io/embed.js"></script><script type="text/javascript" src="/react-native/js/codeblocks.js"></script><link rel="stylesheet" href="/react-native/css/main.css"/></head><body class="sideNavVisible"><div class="fixedHeaderContainer"><div class="headerWrapper wrapper"><header><a href="/react-native/"><img class="logo" src="/react-native/img/header_logo.png"/><h2 class="headerTitle">React Native</h2></a><a href="/react-native/versions.html"><h3>0.31</h3></a><div class="navigationWrapper navigationSlider"><nav class="slidingNav"><ul class="nav-site nav-site-internal"><li><a href="/react-native/docs/0.31/getting-started.html" target="_self">Docs</a></li><li><a href="/react-native/en/help.html" target="_self">Community</a></li><li><a href="/react-native/blog" target="_self">Blog</a></li><li class="navSearchWrapper reactNavSearchWrapper"><input type="text" id="search_input_react" placeholder="Search"/></li><li><a href="https://github.com/facebook/react-native" target="_self">GitHub</a></li><li><a href="https://reactjs.org/" target="_self">React</a></li></ul></nav></div></header></div></div><div class="navPusher"><div class="docMainWrapper wrapper"><div class="container mainContainer"><div class="wrapper"><div class="post"><header class="postHeader"><a class="edit-page-link button" href="https://github.com/facebook/react-native-website/blob/master/website/versioned_docs/version-0.5/virtualizedlist.md" target="_blank">Edit</a><h1>VirtualizedList</h1></header><article><div><span><p>Base implementation for the more convenient <a href="/react-native/docs/0.31/flatlist.html"><code>&lt;FlatList&gt;</code></a> and <a href="/react-native/docs/0.31/sectionlist.html"><code>&lt;SectionList&gt;</code></a> components, which are also better documented. In general, this should only really be used if you need more flexibility than <code>FlatList</code> provides, e.g. for use with immutable data instead of plain arrays.</p>
<p>Virtualization massively improves memory consumption and performance of large lists by maintaining a finite render window of active items and replacing all items outside of the render window with appropriately sized blank space. The window adapts to scrolling behavior, and items are rendered incrementally with low-pri (after any running interactions) if they are far from the visible area, or with hi-pri otherwise to minimize the potential of seeing blank space.</p>
<p>Some caveats:</p>
<ul>
docs/0.32/modal.html
+1 -1
View File
@@ -6,7 +6,7 @@
};
</script></nav></div><div class="container mainContainer"><div class="wrapper"><div class="post"><header class="postHeader"><a class="edit-page-link button" href="https://github.com/facebook/react-native-website/blob/master/website/versioned_docs/version-0.30/modal.md" target="_blank">Edit</a><h1>Modal</h1></header><article><div><span><p>The Modal component is a simple way to present content above an enclosing view.</p>
<p><em>Note: If you need more control over how to present modals over the rest of your app,
then consider using a top-level Navigator. Go <a href="/react-native/navigator-comparison.md">here</a> to compare navigation options.</em></p>
then consider using a top-level Navigator. Go <a href="navigator-comparison.md">here</a> to compare navigation options.</em></p>
<pre><code class="hljs css javascript"><span class="hljs-keyword">import</span> React, { Component } <span class="hljs-keyword">from</span> <span class="hljs-string">'react'</span>;
<span class="hljs-keyword">import</span> { Modal, Text, TouchableHighlight, View } <span class="hljs-keyword">from</span> <span class="hljs-string">'react-native'</span>;
docs/0.32/navigatorios.html
+1 -1
View File
@@ -10,7 +10,7 @@ enabling you to implement a navigation stack. It works exactly the same as it
would on a native app using <code>UINavigationController</code>, providing the same
animations and behavior from UIKIt.</p>
<p>As the name implies, it is only available on iOS. Take a look at
<a href="/react-native/navigator.md"><code>Navigator</code></a> for a similar solution for your
<a href="navigator.md"><code>Navigator</code></a> for a similar solution for your
cross-platform needs, or check out
<a href="https://github.com/wix/react-native-navigation">react-native-navigation</a>, a
component that aims to provide native navigation on both iOS and Android.</p>
docs/0.32/sectionlist.html
+1 -1
View File
@@ -12,7 +12,7 @@
<li>Scroll loading.</li>
</ul>
<p>If you don't need section support and want a simpler interface, use
<a href="/react-native/flatlist.md"><code>&lt;FlatList&gt;</code></a>.</p>
<a href="/react-native/docs/0.32/flatlist.html"><code>&lt;FlatList&gt;</code></a>.</p>
<p>Simple Examples:</p>
<pre><code class="hljs css javascript">&lt;SectionList
renderItem={({item}) =&gt; &lt;ListItem title={item} /&gt;}
docs/0.32/textinput.html
+1 -1
View File
@@ -505,7 +505,7 @@ like passwords stay secure. The default value is <code>false</code>.</p>
</table>
<hr>
<h3><a class="anchor" aria-hidden="true" name="style"></a><a href="#style" aria-hidden="true" class="hash-link" ><svg aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a><code>style</code></h3>
<p><a href="/react-native/style.md">Styles</a></p>
<p><a href="/react-native/docs/0.32/style.html">Styles</a></p>
<table>
<thead>
<tr><th>Type</th><th>Required</th></tr>
docs/0.32/virtualizedlist.html
+1 -1
View File
@@ -1,4 +1,4 @@
<html><head><meta charset="utf-8"/><meta http-equiv="X-UA-Compatible" content="IE=edge, chrome=1"/><title>VirtualizedList · React Native</title><meta name="viewport" content="width=device-width"/><meta name="generator" content="Docusaurus"/><meta property="og:title" content="VirtualizedList · React Native"/><meta property="og:type" content="website"/><meta property="og:url" content="https://facebook.github.io/react-native/index.html"/><meta property="og:description" content="Base implementation for the more convenient [`&lt;FlatList&gt;`](/react-native/flatlist.md) and [`&lt;SectionList&gt;`](/react-native/sectionlist.md) components, which are also better documented. In general, this should only really be used if you need more flexibility than `FlatList` provides, e.g. for use with immutable data instead of plain arrays."/><link rel="shortcut icon" href="/react-native/img/favicon.png"/><link rel="stylesheet" href="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.css"/><link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/solarized-dark.min.css"/><link rel="alternate" type="application/atom+xml" href="https://facebook.github.io/blog/atom.xml" title="React Native Blog ATOM Feed"/><link rel="alternate" type="application/rss+xml" href="https://facebook.github.io/blog/feed.xml" title="React Native Blog RSS Feed"/><script type="text/javascript" src="https://snack.expo.io/embed.js"></script><script type="text/javascript" src="/react-native/js/codeblocks.js"></script><link rel="stylesheet" href="/react-native/css/main.css"/></head><body class="sideNavVisible"><div class="fixedHeaderContainer"><div class="headerWrapper wrapper"><header><a href="/react-native/"><img class="logo" src="/react-native/img/header_logo.png"/><h2 class="headerTitle">React Native</h2></a><a href="/react-native/versions.html"><h3>0.32</h3></a><div class="navigationWrapper navigationSlider"><nav class="slidingNav"><ul class="nav-site nav-site-internal"><li><a href="/react-native/docs/0.32/getting-started.html" target="_self">Docs</a></li><li><a href="/react-native/en/help.html" target="_self">Community</a></li><li><a href="/react-native/blog" target="_self">Blog</a></li><li class="navSearchWrapper reactNavSearchWrapper"><input type="text" id="search_input_react" placeholder="Search"/></li><li><a href="https://github.com/facebook/react-native" target="_self">GitHub</a></li><li><a href="https://reactjs.org/" target="_self">React</a></li></ul></nav></div></header></div></div><div class="navPusher"><div class="docMainWrapper wrapper"><div class="container mainContainer"><div class="wrapper"><div class="post"><header class="postHeader"><a class="edit-page-link button" href="https://github.com/facebook/react-native-website/blob/master/website/versioned_docs/version-0.5/virtualizedlist.md" target="_blank">Edit</a><h1>VirtualizedList</h1></header><article><div><span><p>Base implementation for the more convenient <a href="/react-native/flatlist.md"><code>&lt;FlatList&gt;</code></a> and <a href="/react-native/sectionlist.md"><code>&lt;SectionList&gt;</code></a> components, which are also better documented. In general, this should only really be used if you need more flexibility than <code>FlatList</code> provides, e.g. for use with immutable data instead of plain arrays.</p>
<html><head><meta charset="utf-8"/><meta http-equiv="X-UA-Compatible" content="IE=edge, chrome=1"/><title>VirtualizedList · React Native</title><meta name="viewport" content="width=device-width"/><meta name="generator" content="Docusaurus"/><meta property="og:title" content="VirtualizedList · React Native"/><meta property="og:type" content="website"/><meta property="og:url" content="https://facebook.github.io/react-native/index.html"/><meta property="og:description" content="Base implementation for the more convenient [`&lt;FlatList&gt;`](/react-native/docs/0.32/flatlist.html) and [`&lt;SectionList&gt;`](/react-native/docs/0.32/sectionlist.html) components, which are also better documented. In general, this should only really be used if you need more flexibility than `FlatList` provides, e.g. for use with immutable data instead of plain arrays."/><link rel="shortcut icon" href="/react-native/img/favicon.png"/><link rel="stylesheet" href="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.css"/><link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/solarized-dark.min.css"/><link rel="alternate" type="application/atom+xml" href="https://facebook.github.io/blog/atom.xml" title="React Native Blog ATOM Feed"/><link rel="alternate" type="application/rss+xml" href="https://facebook.github.io/blog/feed.xml" title="React Native Blog RSS Feed"/><script type="text/javascript" src="https://snack.expo.io/embed.js"></script><script type="text/javascript" src="/react-native/js/codeblocks.js"></script><link rel="stylesheet" href="/react-native/css/main.css"/></head><body class="sideNavVisible"><div class="fixedHeaderContainer"><div class="headerWrapper wrapper"><header><a href="/react-native/"><img class="logo" src="/react-native/img/header_logo.png"/><h2 class="headerTitle">React Native</h2></a><a href="/react-native/versions.html"><h3>0.32</h3></a><div class="navigationWrapper navigationSlider"><nav class="slidingNav"><ul class="nav-site nav-site-internal"><li><a href="/react-native/docs/0.32/getting-started.html" target="_self">Docs</a></li><li><a href="/react-native/en/help.html" target="_self">Community</a></li><li><a href="/react-native/blog" target="_self">Blog</a></li><li class="navSearchWrapper reactNavSearchWrapper"><input type="text" id="search_input_react" placeholder="Search"/></li><li><a href="https://github.com/facebook/react-native" target="_self">GitHub</a></li><li><a href="https://reactjs.org/" target="_self">React</a></li></ul></nav></div></header></div></div><div class="navPusher"><div class="docMainWrapper wrapper"><div class="container mainContainer"><div class="wrapper"><div class="post"><header class="postHeader"><a class="edit-page-link button" href="https://github.com/facebook/react-native-website/blob/master/website/versioned_docs/version-0.5/virtualizedlist.md" target="_blank">Edit</a><h1>VirtualizedList</h1></header><article><div><span><p>Base implementation for the more convenient <a href="/react-native/docs/0.32/flatlist.html"><code>&lt;FlatList&gt;</code></a> and <a href="/react-native/docs/0.32/sectionlist.html"><code>&lt;SectionList&gt;</code></a> components, which are also better documented. In general, this should only really be used if you need more flexibility than <code>FlatList</code> provides, e.g. for use with immutable data instead of plain arrays.</p>
<p>Virtualization massively improves memory consumption and performance of large lists by maintaining a finite render window of active items and replacing all items outside of the render window with appropriately sized blank space. The window adapts to scrolling behavior, and items are rendered incrementally with low-pri (after any running interactions) if they are far from the visible area, or with hi-pri otherwise to minimize the potential of seeing blank space.</p>
<p>Some caveats:</p>
<ul>
docs/0.33/modal.html
+1 -1
View File
@@ -6,7 +6,7 @@
};
</script></nav></div><div class="container mainContainer"><div class="wrapper"><div class="post"><header class="postHeader"><a class="edit-page-link button" href="https://github.com/facebook/react-native-website/blob/master/website/versioned_docs/version-0.30/modal.md" target="_blank">Edit</a><h1>Modal</h1></header><article><div><span><p>The Modal component is a simple way to present content above an enclosing view.</p>
<p><em>Note: If you need more control over how to present modals over the rest of your app,
then consider using a top-level Navigator. Go <a href="/react-native/navigator-comparison.md">here</a> to compare navigation options.</em></p>
then consider using a top-level Navigator. Go <a href="navigator-comparison.md">here</a> to compare navigation options.</em></p>
<pre><code class="hljs css javascript"><span class="hljs-keyword">import</span> React, { Component } <span class="hljs-keyword">from</span> <span class="hljs-string">'react'</span>;
<span class="hljs-keyword">import</span> { Modal, Text, TouchableHighlight, View } <span class="hljs-keyword">from</span> <span class="hljs-string">'react-native'</span>;
docs/0.33/navigatorios.html
+1 -1
View File
@@ -10,7 +10,7 @@ enabling you to implement a navigation stack. It works exactly the same as it
would on a native app using <code>UINavigationController</code>, providing the same
animations and behavior from UIKIt.</p>
<p>As the name implies, it is only available on iOS. Take a look at
<a href="/react-native/navigator.md"><code>Navigator</code></a> for a similar solution for your
<a href="navigator.md"><code>Navigator</code></a> for a similar solution for your
cross-platform needs, or check out
<a href="https://github.com/wix/react-native-navigation">react-native-navigation</a>, a
component that aims to provide native navigation on both iOS and Android.</p>
docs/0.33/sectionlist.html
+1 -1
View File
@@ -12,7 +12,7 @@
<li>Scroll loading.</li>
</ul>
<p>If you don't need section support and want a simpler interface, use
<a href="/react-native/flatlist.md"><code>&lt;FlatList&gt;</code></a>.</p>
<a href="/react-native/docs/0.33/flatlist.html"><code>&lt;FlatList&gt;</code></a>.</p>
<p>Simple Examples:</p>
<pre><code class="hljs css javascript">&lt;SectionList
renderItem={({item}) =&gt; &lt;ListItem title={item} /&gt;}
docs/0.33/textinput.html
+1 -1
View File
@@ -505,7 +505,7 @@ like passwords stay secure. The default value is <code>false</code>.</p>
</table>
<hr>
<h3><a class="anchor" aria-hidden="true" name="style"></a><a href="#style" aria-hidden="true" class="hash-link" ><svg aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a><code>style</code></h3>
<p><a href="/react-native/style.md">Styles</a></p>
<p><a href="/react-native/docs/0.33/style.html">Styles</a></p>
<table>
<thead>
<tr><th>Type</th><th>Required</th></tr>
docs/0.33/virtualizedlist.html
+1 -1
View File
@@ -1,4 +1,4 @@
<html><head><meta charset="utf-8"/><meta http-equiv="X-UA-Compatible" content="IE=edge, chrome=1"/><title>VirtualizedList · React Native</title><meta name="viewport" content="width=device-width"/><meta name="generator" content="Docusaurus"/><meta property="og:title" content="VirtualizedList · React Native"/><meta property="og:type" content="website"/><meta property="og:url" content="https://facebook.github.io/react-native/index.html"/><meta property="og:description" content="Base implementation for the more convenient [`&lt;FlatList&gt;`](/react-native/flatlist.md) and [`&lt;SectionList&gt;`](/react-native/sectionlist.md) components, which are also better documented. In general, this should only really be used if you need more flexibility than `FlatList` provides, e.g. for use with immutable data instead of plain arrays."/><link rel="shortcut icon" href="/react-native/img/favicon.png"/><link rel="stylesheet" href="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.css"/><link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/solarized-dark.min.css"/><link rel="alternate" type="application/atom+xml" href="https://facebook.github.io/blog/atom.xml" title="React Native Blog ATOM Feed"/><link rel="alternate" type="application/rss+xml" href="https://facebook.github.io/blog/feed.xml" title="React Native Blog RSS Feed"/><script type="text/javascript" src="https://snack.expo.io/embed.js"></script><script type="text/javascript" src="/react-native/js/codeblocks.js"></script><link rel="stylesheet" href="/react-native/css/main.css"/></head><body class="sideNavVisible"><div class="fixedHeaderContainer"><div class="headerWrapper wrapper"><header><a href="/react-native/"><img class="logo" src="/react-native/img/header_logo.png"/><h2 class="headerTitle">React Native</h2></a><a href="/react-native/versions.html"><h3>0.33</h3></a><div class="navigationWrapper navigationSlider"><nav class="slidingNav"><ul class="nav-site nav-site-internal"><li><a href="/react-native/docs/0.33/getting-started.html" target="_self">Docs</a></li><li><a href="/react-native/en/help.html" target="_self">Community</a></li><li><a href="/react-native/blog" target="_self">Blog</a></li><li class="navSearchWrapper reactNavSearchWrapper"><input type="text" id="search_input_react" placeholder="Search"/></li><li><a href="https://github.com/facebook/react-native" target="_self">GitHub</a></li><li><a href="https://reactjs.org/" target="_self">React</a></li></ul></nav></div></header></div></div><div class="navPusher"><div class="docMainWrapper wrapper"><div class="container mainContainer"><div class="wrapper"><div class="post"><header class="postHeader"><a class="edit-page-link button" href="https://github.com/facebook/react-native-website/blob/master/website/versioned_docs/version-0.5/virtualizedlist.md" target="_blank">Edit</a><h1>VirtualizedList</h1></header><article><div><span><p>Base implementation for the more convenient <a href="/react-native/flatlist.md"><code>&lt;FlatList&gt;</code></a> and <a href="/react-native/sectionlist.md"><code>&lt;SectionList&gt;</code></a> components, which are also better documented. In general, this should only really be used if you need more flexibility than <code>FlatList</code> provides, e.g. for use with immutable data instead of plain arrays.</p>
<html><head><meta charset="utf-8"/><meta http-equiv="X-UA-Compatible" content="IE=edge, chrome=1"/><title>VirtualizedList · React Native</title><meta name="viewport" content="width=device-width"/><meta name="generator" content="Docusaurus"/><meta property="og:title" content="VirtualizedList · React Native"/><meta property="og:type" content="website"/><meta property="og:url" content="https://facebook.github.io/react-native/index.html"/><meta property="og:description" content="Base implementation for the more convenient [`&lt;FlatList&gt;`](/react-native/docs/0.33/flatlist.html) and [`&lt;SectionList&gt;`](/react-native/docs/0.33/sectionlist.html) components, which are also better documented. In general, this should only really be used if you need more flexibility than `FlatList` provides, e.g. for use with immutable data instead of plain arrays."/><link rel="shortcut icon" href="/react-native/img/favicon.png"/><link rel="stylesheet" href="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.css"/><link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/solarized-dark.min.css"/><link rel="alternate" type="application/atom+xml" href="https://facebook.github.io/blog/atom.xml" title="React Native Blog ATOM Feed"/><link rel="alternate" type="application/rss+xml" href="https://facebook.github.io/blog/feed.xml" title="React Native Blog RSS Feed"/><script type="text/javascript" src="https://snack.expo.io/embed.js"></script><script type="text/javascript" src="/react-native/js/codeblocks.js"></script><link rel="stylesheet" href="/react-native/css/main.css"/></head><body class="sideNavVisible"><div class="fixedHeaderContainer"><div class="headerWrapper wrapper"><header><a href="/react-native/"><img class="logo" src="/react-native/img/header_logo.png"/><h2 class="headerTitle">React Native</h2></a><a href="/react-native/versions.html"><h3>0.33</h3></a><div class="navigationWrapper navigationSlider"><nav class="slidingNav"><ul class="nav-site nav-site-internal"><li><a href="/react-native/docs/0.33/getting-started.html" target="_self">Docs</a></li><li><a href="/react-native/en/help.html" target="_self">Community</a></li><li><a href="/react-native/blog" target="_self">Blog</a></li><li class="navSearchWrapper reactNavSearchWrapper"><input type="text" id="search_input_react" placeholder="Search"/></li><li><a href="https://github.com/facebook/react-native" target="_self">GitHub</a></li><li><a href="https://reactjs.org/" target="_self">React</a></li></ul></nav></div></header></div></div><div class="navPusher"><div class="docMainWrapper wrapper"><div class="container mainContainer"><div class="wrapper"><div class="post"><header class="postHeader"><a class="edit-page-link button" href="https://github.com/facebook/react-native-website/blob/master/website/versioned_docs/version-0.5/virtualizedlist.md" target="_blank">Edit</a><h1>VirtualizedList</h1></header><article><div><span><p>Base implementation for the more convenient <a href="/react-native/docs/0.33/flatlist.html"><code>&lt;FlatList&gt;</code></a> and <a href="/react-native/docs/0.33/sectionlist.html"><code>&lt;SectionList&gt;</code></a> components, which are also better documented. In general, this should only really be used if you need more flexibility than <code>FlatList</code> provides, e.g. for use with immutable data instead of plain arrays.</p>
<p>Virtualization massively improves memory consumption and performance of large lists by maintaining a finite render window of active items and replacing all items outside of the render window with appropriately sized blank space. The window adapts to scrolling behavior, and items are rendered incrementally with low-pri (after any running interactions) if they are far from the visible area, or with hi-pri otherwise to minimize the potential of seeing blank space.</p>
<p>Some caveats:</p>
<ul>
docs/0.34/modal.html
+1 -1
View File
@@ -6,7 +6,7 @@
};
</script></nav></div><div class="container mainContainer"><div class="wrapper"><div class="post"><header class="postHeader"><a class="edit-page-link button" href="https://github.com/facebook/react-native-website/blob/master/website/versioned_docs/version-0.34/modal.md" target="_blank">Edit</a><h1>Modal</h1></header><article><div><span><p>The Modal component is a simple way to present content above an enclosing view.</p>
<p><em>Note: If you need more control over how to present modals over the rest of your app,
then consider using a top-level Navigator. Go <a href="/react-native/navigator-comparison.md">here</a> to compare navigation options.</em></p>
then consider using a top-level Navigator. Go <a href="navigator-comparison.md">here</a> to compare navigation options.</em></p>
<pre><code class="hljs css javascript"><span class="hljs-keyword">import</span> React, { Component } <span class="hljs-keyword">from</span> <span class="hljs-string">'react'</span>;
<span class="hljs-keyword">import</span> { Modal, Text, TouchableHighlight, View } <span class="hljs-keyword">from</span> <span class="hljs-string">'react-native'</span>;
docs/0.34/navigatorios.html
+1 -1
View File
@@ -10,7 +10,7 @@ enabling you to implement a navigation stack. It works exactly the same as it
would on a native app using <code>UINavigationController</code>, providing the same
animations and behavior from UIKIt.</p>
<p>As the name implies, it is only available on iOS. Take a look at
<a href="/react-native/navigator.md"><code>Navigator</code></a> for a similar solution for your
<a href="navigator.md"><code>Navigator</code></a> for a similar solution for your
cross-platform needs, or check out
<a href="https://github.com/wix/react-native-navigation">react-native-navigation</a>, a
component that aims to provide native navigation on both iOS and Android.</p>
docs/0.34/sectionlist.html
+1 -1
View File
@@ -12,7 +12,7 @@
<li>Scroll loading.</li>
</ul>
<p>If you don't need section support and want a simpler interface, use
<a href="/react-native/flatlist.md"><code>&lt;FlatList&gt;</code></a>.</p>
<a href="/react-native/docs/0.34/flatlist.html"><code>&lt;FlatList&gt;</code></a>.</p>
<p>Simple Examples:</p>
<pre><code class="hljs css javascript">&lt;SectionList
renderItem={({item}) =&gt; &lt;ListItem title={item} /&gt;}
docs/0.34/textinput.html
+1 -1
View File
@@ -521,7 +521,7 @@ end: PropTypes.number,
</table>
<hr>
<h3><a class="anchor" aria-hidden="true" name="style"></a><a href="#style" aria-hidden="true" class="hash-link" ><svg aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a><code>style</code></h3>
<p><a href="/react-native/style.md">Styles</a></p>
<p><a href="/react-native/docs/0.34/style.html">Styles</a></p>
<table>
<thead>
<tr><th>Type</th><th>Required</th></tr>
docs/0.34/virtualizedlist.html
+1 -1
View File
@@ -1,4 +1,4 @@
<html><head><meta charset="utf-8"/><meta http-equiv="X-UA-Compatible" content="IE=edge, chrome=1"/><title>VirtualizedList · React Native</title><meta name="viewport" content="width=device-width"/><meta name="generator" content="Docusaurus"/><meta property="og:title" content="VirtualizedList · React Native"/><meta property="og:type" content="website"/><meta property="og:url" content="https://facebook.github.io/react-native/index.html"/><meta property="og:description" content="Base implementation for the more convenient [`&lt;FlatList&gt;`](/react-native/flatlist.md) and [`&lt;SectionList&gt;`](/react-native/sectionlist.md) components, which are also better documented. In general, this should only really be used if you need more flexibility than `FlatList` provides, e.g. for use with immutable data instead of plain arrays."/><link rel="shortcut icon" href="/react-native/img/favicon.png"/><link rel="stylesheet" href="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.css"/><link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/solarized-dark.min.css"/><link rel="alternate" type="application/atom+xml" href="https://facebook.github.io/blog/atom.xml" title="React Native Blog ATOM Feed"/><link rel="alternate" type="application/rss+xml" href="https://facebook.github.io/blog/feed.xml" title="React Native Blog RSS Feed"/><script type="text/javascript" src="https://snack.expo.io/embed.js"></script><script type="text/javascript" src="/react-native/js/codeblocks.js"></script><link rel="stylesheet" href="/react-native/css/main.css"/></head><body class="sideNavVisible"><div class="fixedHeaderContainer"><div class="headerWrapper wrapper"><header><a href="/react-native/"><img class="logo" src="/react-native/img/header_logo.png"/><h2 class="headerTitle">React Native</h2></a><a href="/react-native/versions.html"><h3>0.34</h3></a><div class="navigationWrapper navigationSlider"><nav class="slidingNav"><ul class="nav-site nav-site-internal"><li><a href="/react-native/docs/0.34/getting-started.html" target="_self">Docs</a></li><li><a href="/react-native/en/help.html" target="_self">Community</a></li><li><a href="/react-native/blog" target="_self">Blog</a></li><li class="navSearchWrapper reactNavSearchWrapper"><input type="text" id="search_input_react" placeholder="Search"/></li><li><a href="https://github.com/facebook/react-native" target="_self">GitHub</a></li><li><a href="https://reactjs.org/" target="_self">React</a></li></ul></nav></div></header></div></div><div class="navPusher"><div class="docMainWrapper wrapper"><div class="container mainContainer"><div class="wrapper"><div class="post"><header class="postHeader"><a class="edit-page-link button" href="https://github.com/facebook/react-native-website/blob/master/website/versioned_docs/version-0.5/virtualizedlist.md" target="_blank">Edit</a><h1>VirtualizedList</h1></header><article><div><span><p>Base implementation for the more convenient <a href="/react-native/flatlist.md"><code>&lt;FlatList&gt;</code></a> and <a href="/react-native/sectionlist.md"><code>&lt;SectionList&gt;</code></a> components, which are also better documented. In general, this should only really be used if you need more flexibility than <code>FlatList</code> provides, e.g. for use with immutable data instead of plain arrays.</p>
<html><head><meta charset="utf-8"/><meta http-equiv="X-UA-Compatible" content="IE=edge, chrome=1"/><title>VirtualizedList · React Native</title><meta name="viewport" content="width=device-width"/><meta name="generator" content="Docusaurus"/><meta property="og:title" content="VirtualizedList · React Native"/><meta property="og:type" content="website"/><meta property="og:url" content="https://facebook.github.io/react-native/index.html"/><meta property="og:description" content="Base implementation for the more convenient [`&lt;FlatList&gt;`](/react-native/docs/0.34/flatlist.html) and [`&lt;SectionList&gt;`](/react-native/docs/0.34/sectionlist.html) components, which are also better documented. In general, this should only really be used if you need more flexibility than `FlatList` provides, e.g. for use with immutable data instead of plain arrays."/><link rel="shortcut icon" href="/react-native/img/favicon.png"/><link rel="stylesheet" href="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.css"/><link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/solarized-dark.min.css"/><link rel="alternate" type="application/atom+xml" href="https://facebook.github.io/blog/atom.xml" title="React Native Blog ATOM Feed"/><link rel="alternate" type="application/rss+xml" href="https://facebook.github.io/blog/feed.xml" title="React Native Blog RSS Feed"/><script type="text/javascript" src="https://snack.expo.io/embed.js"></script><script type="text/javascript" src="/react-native/js/codeblocks.js"></script><link rel="stylesheet" href="/react-native/css/main.css"/></head><body class="sideNavVisible"><div class="fixedHeaderContainer"><div class="headerWrapper wrapper"><header><a href="/react-native/"><img class="logo" src="/react-native/img/header_logo.png"/><h2 class="headerTitle">React Native</h2></a><a href="/react-native/versions.html"><h3>0.34</h3></a><div class="navigationWrapper navigationSlider"><nav class="slidingNav"><ul class="nav-site nav-site-internal"><li><a href="/react-native/docs/0.34/getting-started.html" target="_self">Docs</a></li><li><a href="/react-native/en/help.html" target="_self">Community</a></li><li><a href="/react-native/blog" target="_self">Blog</a></li><li class="navSearchWrapper reactNavSearchWrapper"><input type="text" id="search_input_react" placeholder="Search"/></li><li><a href="https://github.com/facebook/react-native" target="_self">GitHub</a></li><li><a href="https://reactjs.org/" target="_self">React</a></li></ul></nav></div></header></div></div><div class="navPusher"><div class="docMainWrapper wrapper"><div class="container mainContainer"><div class="wrapper"><div class="post"><header class="postHeader"><a class="edit-page-link button" href="https://github.com/facebook/react-native-website/blob/master/website/versioned_docs/version-0.5/virtualizedlist.md" target="_blank">Edit</a><h1>VirtualizedList</h1></header><article><div><span><p>Base implementation for the more convenient <a href="/react-native/docs/0.34/flatlist.html"><code>&lt;FlatList&gt;</code></a> and <a href="/react-native/docs/0.34/sectionlist.html"><code>&lt;SectionList&gt;</code></a> components, which are also better documented. In general, this should only really be used if you need more flexibility than <code>FlatList</code> provides, e.g. for use with immutable data instead of plain arrays.</p>
<p>Virtualization massively improves memory consumption and performance of large lists by maintaining a finite render window of active items and replacing all items outside of the render window with appropriately sized blank space. The window adapts to scrolling behavior, and items are rendered incrementally with low-pri (after any running interactions) if they are far from the visible area, or with hi-pri otherwise to minimize the potential of seeing blank space.</p>
<p>Some caveats:</p>
<ul>
docs/0.35/modal.html
+1 -1
View File
@@ -6,7 +6,7 @@
};
</script></nav></div><div class="container mainContainer"><div class="wrapper"><div class="post"><header class="postHeader"><a class="edit-page-link button" href="https://github.com/facebook/react-native-website/blob/master/website/versioned_docs/version-0.34/modal.md" target="_blank">Edit</a><h1>Modal</h1></header><article><div><span><p>The Modal component is a simple way to present content above an enclosing view.</p>
<p><em>Note: If you need more control over how to present modals over the rest of your app,
then consider using a top-level Navigator. Go <a href="/react-native/navigator-comparison.md">here</a> to compare navigation options.</em></p>
then consider using a top-level Navigator. Go <a href="navigator-comparison.md">here</a> to compare navigation options.</em></p>
<pre><code class="hljs css javascript"><span class="hljs-keyword">import</span> React, { Component } <span class="hljs-keyword">from</span> <span class="hljs-string">'react'</span>;
<span class="hljs-keyword">import</span> { Modal, Text, TouchableHighlight, View } <span class="hljs-keyword">from</span> <span class="hljs-string">'react-native'</span>;
docs/0.35/navigatorios.html
+1 -1
View File
@@ -10,7 +10,7 @@ enabling you to implement a navigation stack. It works exactly the same as it
would on a native app using <code>UINavigationController</code>, providing the same
animations and behavior from UIKIt.</p>
<p>As the name implies, it is only available on iOS. Take a look at
<a href="/react-native/navigator.md"><code>Navigator</code></a> for a similar solution for your
<a href="navigator.md"><code>Navigator</code></a> for a similar solution for your
cross-platform needs, or check out
<a href="https://github.com/wix/react-native-navigation">react-native-navigation</a>, a
component that aims to provide native navigation on both iOS and Android.</p>
docs/0.35/sectionlist.html
+1 -1
View File
@@ -12,7 +12,7 @@
<li>Scroll loading.</li>
</ul>
<p>If you don't need section support and want a simpler interface, use
<a href="/react-native/flatlist.md"><code>&lt;FlatList&gt;</code></a>.</p>
<a href="/react-native/docs/0.35/flatlist.html"><code>&lt;FlatList&gt;</code></a>.</p>
<p>Simple Examples:</p>
<pre><code class="hljs css javascript">&lt;SectionList
renderItem={({item}) =&gt; &lt;ListItem title={item} /&gt;}
docs/0.35/textinput.html
+1 -1
View File
@@ -521,7 +521,7 @@ end: PropTypes.number,
</table>
<hr>
<h3><a class="anchor" aria-hidden="true" name="style"></a><a href="#style" aria-hidden="true" class="hash-link" ><svg aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a><code>style</code></h3>
<p><a href="/react-native/style.md">Styles</a></p>
<p><a href="/react-native/docs/0.35/style.html">Styles</a></p>
<table>
<thead>
<tr><th>Type</th><th>Required</th></tr>
docs/0.35/virtualizedlist.html
+1 -1
View File
@@ -1,4 +1,4 @@
<html><head><meta charset="utf-8"/><meta http-equiv="X-UA-Compatible" content="IE=edge, chrome=1"/><title>VirtualizedList · React Native</title><meta name="viewport" content="width=device-width"/><meta name="generator" content="Docusaurus"/><meta property="og:title" content="VirtualizedList · React Native"/><meta property="og:type" content="website"/><meta property="og:url" content="https://facebook.github.io/react-native/index.html"/><meta property="og:description" content="Base implementation for the more convenient [`&lt;FlatList&gt;`](/react-native/flatlist.md) and [`&lt;SectionList&gt;`](/react-native/sectionlist.md) components, which are also better documented. In general, this should only really be used if you need more flexibility than `FlatList` provides, e.g. for use with immutable data instead of plain arrays."/><link rel="shortcut icon" href="/react-native/img/favicon.png"/><link rel="stylesheet" href="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.css"/><link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/solarized-dark.min.css"/><link rel="alternate" type="application/atom+xml" href="https://facebook.github.io/blog/atom.xml" title="React Native Blog ATOM Feed"/><link rel="alternate" type="application/rss+xml" href="https://facebook.github.io/blog/feed.xml" title="React Native Blog RSS Feed"/><script type="text/javascript" src="https://snack.expo.io/embed.js"></script><script type="text/javascript" src="/react-native/js/codeblocks.js"></script><link rel="stylesheet" href="/react-native/css/main.css"/></head><body class="sideNavVisible"><div class="fixedHeaderContainer"><div class="headerWrapper wrapper"><header><a href="/react-native/"><img class="logo" src="/react-native/img/header_logo.png"/><h2 class="headerTitle">React Native</h2></a><a href="/react-native/versions.html"><h3>0.35</h3></a><div class="navigationWrapper navigationSlider"><nav class="slidingNav"><ul class="nav-site nav-site-internal"><li><a href="/react-native/docs/0.35/getting-started.html" target="_self">Docs</a></li><li><a href="/react-native/en/help.html" target="_self">Community</a></li><li><a href="/react-native/blog" target="_self">Blog</a></li><li class="navSearchWrapper reactNavSearchWrapper"><input type="text" id="search_input_react" placeholder="Search"/></li><li><a href="https://github.com/facebook/react-native" target="_self">GitHub</a></li><li><a href="https://reactjs.org/" target="_self">React</a></li></ul></nav></div></header></div></div><div class="navPusher"><div class="docMainWrapper wrapper"><div class="container mainContainer"><div class="wrapper"><div class="post"><header class="postHeader"><a class="edit-page-link button" href="https://github.com/facebook/react-native-website/blob/master/website/versioned_docs/version-0.5/virtualizedlist.md" target="_blank">Edit</a><h1>VirtualizedList</h1></header><article><div><span><p>Base implementation for the more convenient <a href="/react-native/flatlist.md"><code>&lt;FlatList&gt;</code></a> and <a href="/react-native/sectionlist.md"><code>&lt;SectionList&gt;</code></a> components, which are also better documented. In general, this should only really be used if you need more flexibility than <code>FlatList</code> provides, e.g. for use with immutable data instead of plain arrays.</p>
<html><head><meta charset="utf-8"/><meta http-equiv="X-UA-Compatible" content="IE=edge, chrome=1"/><title>VirtualizedList · React Native</title><meta name="viewport" content="width=device-width"/><meta name="generator" content="Docusaurus"/><meta property="og:title" content="VirtualizedList · React Native"/><meta property="og:type" content="website"/><meta property="og:url" content="https://facebook.github.io/react-native/index.html"/><meta property="og:description" content="Base implementation for the more convenient [`&lt;FlatList&gt;`](/react-native/docs/0.35/flatlist.html) and [`&lt;SectionList&gt;`](/react-native/docs/0.35/sectionlist.html) components, which are also better documented. In general, this should only really be used if you need more flexibility than `FlatList` provides, e.g. for use with immutable data instead of plain arrays."/><link rel="shortcut icon" href="/react-native/img/favicon.png"/><link rel="stylesheet" href="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.css"/><link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/solarized-dark.min.css"/><link rel="alternate" type="application/atom+xml" href="https://facebook.github.io/blog/atom.xml" title="React Native Blog ATOM Feed"/><link rel="alternate" type="application/rss+xml" href="https://facebook.github.io/blog/feed.xml" title="React Native Blog RSS Feed"/><script type="text/javascript" src="https://snack.expo.io/embed.js"></script><script type="text/javascript" src="/react-native/js/codeblocks.js"></script><link rel="stylesheet" href="/react-native/css/main.css"/></head><body class="sideNavVisible"><div class="fixedHeaderContainer"><div class="headerWrapper wrapper"><header><a href="/react-native/"><img class="logo" src="/react-native/img/header_logo.png"/><h2 class="headerTitle">React Native</h2></a><a href="/react-native/versions.html"><h3>0.35</h3></a><div class="navigationWrapper navigationSlider"><nav class="slidingNav"><ul class="nav-site nav-site-internal"><li><a href="/react-native/docs/0.35/getting-started.html" target="_self">Docs</a></li><li><a href="/react-native/en/help.html" target="_self">Community</a></li><li><a href="/react-native/blog" target="_self">Blog</a></li><li class="navSearchWrapper reactNavSearchWrapper"><input type="text" id="search_input_react" placeholder="Search"/></li><li><a href="https://github.com/facebook/react-native" target="_self">GitHub</a></li><li><a href="https://reactjs.org/" target="_self">React</a></li></ul></nav></div></header></div></div><div class="navPusher"><div class="docMainWrapper wrapper"><div class="container mainContainer"><div class="wrapper"><div class="post"><header class="postHeader"><a class="edit-page-link button" href="https://github.com/facebook/react-native-website/blob/master/website/versioned_docs/version-0.5/virtualizedlist.md" target="_blank">Edit</a><h1>VirtualizedList</h1></header><article><div><span><p>Base implementation for the more convenient <a href="/react-native/docs/0.35/flatlist.html"><code>&lt;FlatList&gt;</code></a> and <a href="/react-native/docs/0.35/sectionlist.html"><code>&lt;SectionList&gt;</code></a> components, which are also better documented. In general, this should only really be used if you need more flexibility than <code>FlatList</code> provides, e.g. for use with immutable data instead of plain arrays.</p>
<p>Virtualization massively improves memory consumption and performance of large lists by maintaining a finite render window of active items and replacing all items outside of the render window with appropriately sized blank space. The window adapts to scrolling behavior, and items are rendered incrementally with low-pri (after any running interactions) if they are far from the visible area, or with hi-pri otherwise to minimize the potential of seeing blank space.</p>
<p>Some caveats:</p>
<ul>
docs/0.36/navigatorios.html
+1 -1
View File
@@ -10,7 +10,7 @@ enabling you to implement a navigation stack. It works exactly the same as it
would on a native app using <code>UINavigationController</code>, providing the same
animations and behavior from UIKIt.</p>
<p>As the name implies, it is only available on iOS. Take a look at
<a href="/react-native/navigator.md"><code>Navigator</code></a> for a similar solution for your
<a href="navigator.md"><code>Navigator</code></a> for a similar solution for your
cross-platform needs, or check out
<a href="https://github.com/wix/react-native-navigation">react-native-navigation</a>, a
component that aims to provide native navigation on both iOS and Android.</p>
docs/0.36/sectionlist.html
+1 -1
View File
@@ -12,7 +12,7 @@
<li>Scroll loading.</li>
</ul>
<p>If you don't need section support and want a simpler interface, use
<a href="/react-native/flatlist.md"><code>&lt;FlatList&gt;</code></a>.</p>
<a href="/react-native/docs/0.36/flatlist.html"><code>&lt;FlatList&gt;</code></a>.</p>
<p>Simple Examples:</p>
<pre><code class="hljs css javascript">&lt;SectionList
renderItem={({item}) =&gt; &lt;ListItem title={item} /&gt;}
docs/0.36/textinput.html
+1 -1
View File
@@ -521,7 +521,7 @@ end: PropTypes.number,
</table>
<hr>
<h3><a class="anchor" aria-hidden="true" name="style"></a><a href="#style" aria-hidden="true" class="hash-link" ><svg aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a><code>style</code></h3>
<p><a href="/react-native/style.md">Styles</a></p>
<p><a href="/react-native/docs/0.36/style.html">Styles</a></p>
<table>
<thead>
<tr><th>Type</th><th>Required</th></tr>
docs/0.36/virtualizedlist.html
+1 -1
View File
@@ -1,4 +1,4 @@
<html><head><meta charset="utf-8"/><meta http-equiv="X-UA-Compatible" content="IE=edge, chrome=1"/><title>VirtualizedList · React Native</title><meta name="viewport" content="width=device-width"/><meta name="generator" content="Docusaurus"/><meta property="og:title" content="VirtualizedList · React Native"/><meta property="og:type" content="website"/><meta property="og:url" content="https://facebook.github.io/react-native/index.html"/><meta property="og:description" content="Base implementation for the more convenient [`&lt;FlatList&gt;`](/react-native/flatlist.md) and [`&lt;SectionList&gt;`](/react-native/sectionlist.md) components, which are also better documented. In general, this should only really be used if you need more flexibility than `FlatList` provides, e.g. for use with immutable data instead of plain arrays."/><link rel="shortcut icon" href="/react-native/img/favicon.png"/><link rel="stylesheet" href="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.css"/><link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/solarized-dark.min.css"/><link rel="alternate" type="application/atom+xml" href="https://facebook.github.io/blog/atom.xml" title="React Native Blog ATOM Feed"/><link rel="alternate" type="application/rss+xml" href="https://facebook.github.io/blog/feed.xml" title="React Native Blog RSS Feed"/><script type="text/javascript" src="https://snack.expo.io/embed.js"></script><script type="text/javascript" src="/react-native/js/codeblocks.js"></script><link rel="stylesheet" href="/react-native/css/main.css"/></head><body class="sideNavVisible"><div class="fixedHeaderContainer"><div class="headerWrapper wrapper"><header><a href="/react-native/"><img class="logo" src="/react-native/img/header_logo.png"/><h2 class="headerTitle">React Native</h2></a><a href="/react-native/versions.html"><h3>0.36</h3></a><div class="navigationWrapper navigationSlider"><nav class="slidingNav"><ul class="nav-site nav-site-internal"><li><a href="/react-native/docs/0.36/getting-started.html" target="_self">Docs</a></li><li><a href="/react-native/en/help.html" target="_self">Community</a></li><li><a href="/react-native/blog" target="_self">Blog</a></li><li class="navSearchWrapper reactNavSearchWrapper"><input type="text" id="search_input_react" placeholder="Search"/></li><li><a href="https://github.com/facebook/react-native" target="_self">GitHub</a></li><li><a href="https://reactjs.org/" target="_self">React</a></li></ul></nav></div></header></div></div><div class="navPusher"><div class="docMainWrapper wrapper"><div class="container mainContainer"><div class="wrapper"><div class="post"><header class="postHeader"><a class="edit-page-link button" href="https://github.com/facebook/react-native-website/blob/master/website/versioned_docs/version-0.5/virtualizedlist.md" target="_blank">Edit</a><h1>VirtualizedList</h1></header><article><div><span><p>Base implementation for the more convenient <a href="/react-native/flatlist.md"><code>&lt;FlatList&gt;</code></a> and <a href="/react-native/sectionlist.md"><code>&lt;SectionList&gt;</code></a> components, which are also better documented. In general, this should only really be used if you need more flexibility than <code>FlatList</code> provides, e.g. for use with immutable data instead of plain arrays.</p>
<html><head><meta charset="utf-8"/><meta http-equiv="X-UA-Compatible" content="IE=edge, chrome=1"/><title>VirtualizedList · React Native</title><meta name="viewport" content="width=device-width"/><meta name="generator" content="Docusaurus"/><meta property="og:title" content="VirtualizedList · React Native"/><meta property="og:type" content="website"/><meta property="og:url" content="https://facebook.github.io/react-native/index.html"/><meta property="og:description" content="Base implementation for the more convenient [`&lt;FlatList&gt;`](/react-native/docs/0.36/flatlist.html) and [`&lt;SectionList&gt;`](/react-native/docs/0.36/sectionlist.html) components, which are also better documented. In general, this should only really be used if you need more flexibility than `FlatList` provides, e.g. for use with immutable data instead of plain arrays."/><link rel="shortcut icon" href="/react-native/img/favicon.png"/><link rel="stylesheet" href="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.css"/><link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/solarized-dark.min.css"/><link rel="alternate" type="application/atom+xml" href="https://facebook.github.io/blog/atom.xml" title="React Native Blog ATOM Feed"/><link rel="alternate" type="application/rss+xml" href="https://facebook.github.io/blog/feed.xml" title="React Native Blog RSS Feed"/><script type="text/javascript" src="https://snack.expo.io/embed.js"></script><script type="text/javascript" src="/react-native/js/codeblocks.js"></script><link rel="stylesheet" href="/react-native/css/main.css"/></head><body class="sideNavVisible"><div class="fixedHeaderContainer"><div class="headerWrapper wrapper"><header><a href="/react-native/"><img class="logo" src="/react-native/img/header_logo.png"/><h2 class="headerTitle">React Native</h2></a><a href="/react-native/versions.html"><h3>0.36</h3></a><div class="navigationWrapper navigationSlider"><nav class="slidingNav"><ul class="nav-site nav-site-internal"><li><a href="/react-native/docs/0.36/getting-started.html" target="_self">Docs</a></li><li><a href="/react-native/en/help.html" target="_self">Community</a></li><li><a href="/react-native/blog" target="_self">Blog</a></li><li class="navSearchWrapper reactNavSearchWrapper"><input type="text" id="search_input_react" placeholder="Search"/></li><li><a href="https://github.com/facebook/react-native" target="_self">GitHub</a></li><li><a href="https://reactjs.org/" target="_self">React</a></li></ul></nav></div></header></div></div><div class="navPusher"><div class="docMainWrapper wrapper"><div class="container mainContainer"><div class="wrapper"><div class="post"><header class="postHeader"><a class="edit-page-link button" href="https://github.com/facebook/react-native-website/blob/master/website/versioned_docs/version-0.5/virtualizedlist.md" target="_blank">Edit</a><h1>VirtualizedList</h1></header><article><div><span><p>Base implementation for the more convenient <a href="/react-native/docs/0.36/flatlist.html"><code>&lt;FlatList&gt;</code></a> and <a href="/react-native/docs/0.36/sectionlist.html"><code>&lt;SectionList&gt;</code></a> components, which are also better documented. In general, this should only really be used if you need more flexibility than <code>FlatList</code> provides, e.g. for use with immutable data instead of plain arrays.</p>
<p>Virtualization massively improves memory consumption and performance of large lists by maintaining a finite render window of active items and replacing all items outside of the render window with appropriately sized blank space. The window adapts to scrolling behavior, and items are rendered incrementally with low-pri (after any running interactions) if they are far from the visible area, or with hi-pri otherwise to minimize the potential of seeing blank space.</p>
<p>Some caveats:</p>
<ul>
docs/0.37/navigatorios.html
+1 -1
View File
@@ -10,7 +10,7 @@ enabling you to implement a navigation stack. It works exactly the same as it
would on a native app using <code>UINavigationController</code>, providing the same
animations and behavior from UIKIt.</p>
<p>As the name implies, it is only available on iOS. Take a look at
<a href="/react-native/navigator.md"><code>Navigator</code></a> for a similar solution for your
<a href="navigator.md"><code>Navigator</code></a> for a similar solution for your
cross-platform needs, or check out
<a href="https://github.com/wix/react-native-navigation">react-native-navigation</a>, a
component that aims to provide native navigation on both iOS and Android.</p>
docs/0.37/sectionlist.html
+1 -1
View File
@@ -12,7 +12,7 @@
<li>Scroll loading.</li>
</ul>
<p>If you don't need section support and want a simpler interface, use
<a href="/react-native/flatlist.md"><code>&lt;FlatList&gt;</code></a>.</p>
<a href="/react-native/docs/0.37/flatlist.html"><code>&lt;FlatList&gt;</code></a>.</p>
<p>Simple Examples:</p>
<pre><code class="hljs css javascript">&lt;SectionList
renderItem={({item}) =&gt; &lt;ListItem title={item} /&gt;}
docs/0.37/textinput.html
+1 -1
View File
@@ -481,7 +481,7 @@ the same value to position the cursor.</p>
</table>
<hr>
<h3><a class="anchor" aria-hidden="true" name="style"></a><a href="#style" aria-hidden="true" class="hash-link" ><svg aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a><code>style</code></h3>
<p><a href="/react-native/style.md">Styles</a></p>
<p><a href="/react-native/docs/0.37/style.html">Styles</a></p>
<table>
<thead>
<tr><th>Type</th><th>Required</th></tr>
docs/0.37/virtualizedlist.html
+1 -1
View File
@@ -1,4 +1,4 @@
<html><head><meta charset="utf-8"/><meta http-equiv="X-UA-Compatible" content="IE=edge, chrome=1"/><title>VirtualizedList · React Native</title><meta name="viewport" content="width=device-width"/><meta name="generator" content="Docusaurus"/><meta property="og:title" content="VirtualizedList · React Native"/><meta property="og:type" content="website"/><meta property="og:url" content="https://facebook.github.io/react-native/index.html"/><meta property="og:description" content="Base implementation for the more convenient [`&lt;FlatList&gt;`](/react-native/flatlist.md) and [`&lt;SectionList&gt;`](/react-native/sectionlist.md) components, which are also better documented. In general, this should only really be used if you need more flexibility than `FlatList` provides, e.g. for use with immutable data instead of plain arrays."/><link rel="shortcut icon" href="/react-native/img/favicon.png"/><link rel="stylesheet" href="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.css"/><link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/solarized-dark.min.css"/><link rel="alternate" type="application/atom+xml" href="https://facebook.github.io/blog/atom.xml" title="React Native Blog ATOM Feed"/><link rel="alternate" type="application/rss+xml" href="https://facebook.github.io/blog/feed.xml" title="React Native Blog RSS Feed"/><script type="text/javascript" src="https://snack.expo.io/embed.js"></script><script type="text/javascript" src="/react-native/js/codeblocks.js"></script><link rel="stylesheet" href="/react-native/css/main.css"/></head><body class="sideNavVisible"><div class="fixedHeaderContainer"><div class="headerWrapper wrapper"><header><a href="/react-native/"><img class="logo" src="/react-native/img/header_logo.png"/><h2 class="headerTitle">React Native</h2></a><a href="/react-native/versions.html"><h3>0.37</h3></a><div class="navigationWrapper navigationSlider"><nav class="slidingNav"><ul class="nav-site nav-site-internal"><li><a href="/react-native/docs/0.37/getting-started.html" target="_self">Docs</a></li><li><a href="/react-native/en/help.html" target="_self">Community</a></li><li><a href="/react-native/blog" target="_self">Blog</a></li><li class="navSearchWrapper reactNavSearchWrapper"><input type="text" id="search_input_react" placeholder="Search"/></li><li><a href="https://github.com/facebook/react-native" target="_self">GitHub</a></li><li><a href="https://reactjs.org/" target="_self">React</a></li></ul></nav></div></header></div></div><div class="navPusher"><div class="docMainWrapper wrapper"><div class="container mainContainer"><div class="wrapper"><div class="post"><header class="postHeader"><a class="edit-page-link button" href="https://github.com/facebook/react-native-website/blob/master/website/versioned_docs/version-0.5/virtualizedlist.md" target="_blank">Edit</a><h1>VirtualizedList</h1></header><article><div><span><p>Base implementation for the more convenient <a href="/react-native/flatlist.md"><code>&lt;FlatList&gt;</code></a> and <a href="/react-native/sectionlist.md"><code>&lt;SectionList&gt;</code></a> components, which are also better documented. In general, this should only really be used if you need more flexibility than <code>FlatList</code> provides, e.g. for use with immutable data instead of plain arrays.</p>
<html><head><meta charset="utf-8"/><meta http-equiv="X-UA-Compatible" content="IE=edge, chrome=1"/><title>VirtualizedList · React Native</title><meta name="viewport" content="width=device-width"/><meta name="generator" content="Docusaurus"/><meta property="og:title" content="VirtualizedList · React Native"/><meta property="og:type" content="website"/><meta property="og:url" content="https://facebook.github.io/react-native/index.html"/><meta property="og:description" content="Base implementation for the more convenient [`&lt;FlatList&gt;`](/react-native/docs/0.37/flatlist.html) and [`&lt;SectionList&gt;`](/react-native/docs/0.37/sectionlist.html) components, which are also better documented. In general, this should only really be used if you need more flexibility than `FlatList` provides, e.g. for use with immutable data instead of plain arrays."/><link rel="shortcut icon" href="/react-native/img/favicon.png"/><link rel="stylesheet" href="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.css"/><link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/solarized-dark.min.css"/><link rel="alternate" type="application/atom+xml" href="https://facebook.github.io/blog/atom.xml" title="React Native Blog ATOM Feed"/><link rel="alternate" type="application/rss+xml" href="https://facebook.github.io/blog/feed.xml" title="React Native Blog RSS Feed"/><script type="text/javascript" src="https://snack.expo.io/embed.js"></script><script type="text/javascript" src="/react-native/js/codeblocks.js"></script><link rel="stylesheet" href="/react-native/css/main.css"/></head><body class="sideNavVisible"><div class="fixedHeaderContainer"><div class="headerWrapper wrapper"><header><a href="/react-native/"><img class="logo" src="/react-native/img/header_logo.png"/><h2 class="headerTitle">React Native</h2></a><a href="/react-native/versions.html"><h3>0.37</h3></a><div class="navigationWrapper navigationSlider"><nav class="slidingNav"><ul class="nav-site nav-site-internal"><li><a href="/react-native/docs/0.37/getting-started.html" target="_self">Docs</a></li><li><a href="/react-native/en/help.html" target="_self">Community</a></li><li><a href="/react-native/blog" target="_self">Blog</a></li><li class="navSearchWrapper reactNavSearchWrapper"><input type="text" id="search_input_react" placeholder="Search"/></li><li><a href="https://github.com/facebook/react-native" target="_self">GitHub</a></li><li><a href="https://reactjs.org/" target="_self">React</a></li></ul></nav></div></header></div></div><div class="navPusher"><div class="docMainWrapper wrapper"><div class="container mainContainer"><div class="wrapper"><div class="post"><header class="postHeader"><a class="edit-page-link button" href="https://github.com/facebook/react-native-website/blob/master/website/versioned_docs/version-0.5/virtualizedlist.md" target="_blank">Edit</a><h1>VirtualizedList</h1></header><article><div><span><p>Base implementation for the more convenient <a href="/react-native/docs/0.37/flatlist.html"><code>&lt;FlatList&gt;</code></a> and <a href="/react-native/docs/0.37/sectionlist.html"><code>&lt;SectionList&gt;</code></a> components, which are also better documented. In general, this should only really be used if you need more flexibility than <code>FlatList</code> provides, e.g. for use with immutable data instead of plain arrays.</p>
<p>Virtualization massively improves memory consumption and performance of large lists by maintaining a finite render window of active items and replacing all items outside of the render window with appropriately sized blank space. The window adapts to scrolling behavior, and items are rendered incrementally with low-pri (after any running interactions) if they are far from the visible area, or with hi-pri otherwise to minimize the potential of seeing blank space.</p>
<p>Some caveats:</p>
<ul>
docs/0.38/navigatorios.html
+1 -1
View File
@@ -10,7 +10,7 @@ enabling you to implement a navigation stack. It works exactly the same as it
would on a native app using <code>UINavigationController</code>, providing the same
animations and behavior from UIKIt.</p>
<p>As the name implies, it is only available on iOS. Take a look at
<a href="/react-native/navigator.md"><code>Navigator</code></a> for a similar solution for your
<a href="navigator.md"><code>Navigator</code></a> for a similar solution for your
cross-platform needs, or check out
<a href="https://github.com/wix/react-native-navigation">react-native-navigation</a>, a
component that aims to provide native navigation on both iOS and Android.</p>
docs/0.38/sectionlist.html
+1 -1
View File
@@ -12,7 +12,7 @@
<li>Scroll loading.</li>
</ul>
<p>If you don't need section support and want a simpler interface, use
<a href="/react-native/flatlist.md"><code>&lt;FlatList&gt;</code></a>.</p>
<a href="/react-native/docs/0.38/flatlist.html"><code>&lt;FlatList&gt;</code></a>.</p>
<p>Simple Examples:</p>
<pre><code class="hljs css javascript">&lt;SectionList
renderItem={({item}) =&gt; &lt;ListItem title={item} /&gt;}
docs/0.38/textinput.html
+1 -1
View File
@@ -487,7 +487,7 @@ the same value to position the cursor.</p>
</table>
<hr>
<h3><a class="anchor" aria-hidden="true" name="style"></a><a href="#style" aria-hidden="true" class="hash-link" ><svg aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a><code>style</code></h3>
<p><a href="/react-native/style.md">Styles</a></p>
<p><a href="/react-native/docs/0.38/style.html">Styles</a></p>
<table>
<thead>
<tr><th>Type</th><th>Required</th></tr>
docs/0.38/virtualizedlist.html
+1 -1
View File
@@ -1,4 +1,4 @@
<html><head><meta charset="utf-8"/><meta http-equiv="X-UA-Compatible" content="IE=edge, chrome=1"/><title>VirtualizedList · React Native</title><meta name="viewport" content="width=device-width"/><meta name="generator" content="Docusaurus"/><meta property="og:title" content="VirtualizedList · React Native"/><meta property="og:type" content="website"/><meta property="og:url" content="https://facebook.github.io/react-native/index.html"/><meta property="og:description" content="Base implementation for the more convenient [`&lt;FlatList&gt;`](/react-native/flatlist.md) and [`&lt;SectionList&gt;`](/react-native/sectionlist.md) components, which are also better documented. In general, this should only really be used if you need more flexibility than `FlatList` provides, e.g. for use with immutable data instead of plain arrays."/><link rel="shortcut icon" href="/react-native/img/favicon.png"/><link rel="stylesheet" href="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.css"/><link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/solarized-dark.min.css"/><link rel="alternate" type="application/atom+xml" href="https://facebook.github.io/blog/atom.xml" title="React Native Blog ATOM Feed"/><link rel="alternate" type="application/rss+xml" href="https://facebook.github.io/blog/feed.xml" title="React Native Blog RSS Feed"/><script type="text/javascript" src="https://snack.expo.io/embed.js"></script><script type="text/javascript" src="/react-native/js/codeblocks.js"></script><link rel="stylesheet" href="/react-native/css/main.css"/></head><body class="sideNavVisible"><div class="fixedHeaderContainer"><div class="headerWrapper wrapper"><header><a href="/react-native/"><img class="logo" src="/react-native/img/header_logo.png"/><h2 class="headerTitle">React Native</h2></a><a href="/react-native/versions.html"><h3>0.38</h3></a><div class="navigationWrapper navigationSlider"><nav class="slidingNav"><ul class="nav-site nav-site-internal"><li><a href="/react-native/docs/0.38/getting-started.html" target="_self">Docs</a></li><li><a href="/react-native/en/help.html" target="_self">Community</a></li><li><a href="/react-native/blog" target="_self">Blog</a></li><li class="navSearchWrapper reactNavSearchWrapper"><input type="text" id="search_input_react" placeholder="Search"/></li><li><a href="https://github.com/facebook/react-native" target="_self">GitHub</a></li><li><a href="https://reactjs.org/" target="_self">React</a></li></ul></nav></div></header></div></div><div class="navPusher"><div class="docMainWrapper wrapper"><div class="container mainContainer"><div class="wrapper"><div class="post"><header class="postHeader"><a class="edit-page-link button" href="https://github.com/facebook/react-native-website/blob/master/website/versioned_docs/version-0.5/virtualizedlist.md" target="_blank">Edit</a><h1>VirtualizedList</h1></header><article><div><span><p>Base implementation for the more convenient <a href="/react-native/flatlist.md"><code>&lt;FlatList&gt;</code></a> and <a href="/react-native/sectionlist.md"><code>&lt;SectionList&gt;</code></a> components, which are also better documented. In general, this should only really be used if you need more flexibility than <code>FlatList</code> provides, e.g. for use with immutable data instead of plain arrays.</p>
<html><head><meta charset="utf-8"/><meta http-equiv="X-UA-Compatible" content="IE=edge, chrome=1"/><title>VirtualizedList · React Native</title><meta name="viewport" content="width=device-width"/><meta name="generator" content="Docusaurus"/><meta property="og:title" content="VirtualizedList · React Native"/><meta property="og:type" content="website"/><meta property="og:url" content="https://facebook.github.io/react-native/index.html"/><meta property="og:description" content="Base implementation for the more convenient [`&lt;FlatList&gt;`](/react-native/docs/0.38/flatlist.html) and [`&lt;SectionList&gt;`](/react-native/docs/0.38/sectionlist.html) components, which are also better documented. In general, this should only really be used if you need more flexibility than `FlatList` provides, e.g. for use with immutable data instead of plain arrays."/><link rel="shortcut icon" href="/react-native/img/favicon.png"/><link rel="stylesheet" href="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.css"/><link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/solarized-dark.min.css"/><link rel="alternate" type="application/atom+xml" href="https://facebook.github.io/blog/atom.xml" title="React Native Blog ATOM Feed"/><link rel="alternate" type="application/rss+xml" href="https://facebook.github.io/blog/feed.xml" title="React Native Blog RSS Feed"/><script type="text/javascript" src="https://snack.expo.io/embed.js"></script><script type="text/javascript" src="/react-native/js/codeblocks.js"></script><link rel="stylesheet" href="/react-native/css/main.css"/></head><body class="sideNavVisible"><div class="fixedHeaderContainer"><div class="headerWrapper wrapper"><header><a href="/react-native/"><img class="logo" src="/react-native/img/header_logo.png"/><h2 class="headerTitle">React Native</h2></a><a href="/react-native/versions.html"><h3>0.38</h3></a><div class="navigationWrapper navigationSlider"><nav class="slidingNav"><ul class="nav-site nav-site-internal"><li><a href="/react-native/docs/0.38/getting-started.html" target="_self">Docs</a></li><li><a href="/react-native/en/help.html" target="_self">Community</a></li><li><a href="/react-native/blog" target="_self">Blog</a></li><li class="navSearchWrapper reactNavSearchWrapper"><input type="text" id="search_input_react" placeholder="Search"/></li><li><a href="https://github.com/facebook/react-native" target="_self">GitHub</a></li><li><a href="https://reactjs.org/" target="_self">React</a></li></ul></nav></div></header></div></div><div class="navPusher"><div class="docMainWrapper wrapper"><div class="container mainContainer"><div class="wrapper"><div class="post"><header class="postHeader"><a class="edit-page-link button" href="https://github.com/facebook/react-native-website/blob/master/website/versioned_docs/version-0.5/virtualizedlist.md" target="_blank">Edit</a><h1>VirtualizedList</h1></header><article><div><span><p>Base implementation for the more convenient <a href="/react-native/docs/0.38/flatlist.html"><code>&lt;FlatList&gt;</code></a> and <a href="/react-native/docs/0.38/sectionlist.html"><code>&lt;SectionList&gt;</code></a> components, which are also better documented. In general, this should only really be used if you need more flexibility than <code>FlatList</code> provides, e.g. for use with immutable data instead of plain arrays.</p>
<p>Virtualization massively improves memory consumption and performance of large lists by maintaining a finite render window of active items and replacing all items outside of the render window with appropriately sized blank space. The window adapts to scrolling behavior, and items are rendered incrementally with low-pri (after any running interactions) if they are far from the visible area, or with hi-pri otherwise to minimize the potential of seeing blank space.</p>
<p>Some caveats:</p>
<ul>
docs/0.39/navigatorios.html
+1 -1
View File
@@ -10,7 +10,7 @@ enabling you to implement a navigation stack. It works exactly the same as it
would on a native app using <code>UINavigationController</code>, providing the same
animations and behavior from UIKIt.</p>
<p>As the name implies, it is only available on iOS. Take a look at
<a href="/react-native/navigator.md"><code>Navigator</code></a> for a similar solution for your
<a href="navigator.md"><code>Navigator</code></a> for a similar solution for your
cross-platform needs, or check out
<a href="https://github.com/wix/react-native-navigation">react-native-navigation</a>, a
component that aims to provide native navigation on both iOS and Android.</p>
docs/0.39/sectionlist.html
+1 -1
View File
@@ -12,7 +12,7 @@
<li>Scroll loading.</li>
</ul>
<p>If you don't need section support and want a simpler interface, use
<a href="/react-native/flatlist.md"><code>&lt;FlatList&gt;</code></a>.</p>
<a href="/react-native/docs/0.39/flatlist.html"><code>&lt;FlatList&gt;</code></a>.</p>
<p>Simple Examples:</p>
<pre><code class="hljs css javascript">&lt;SectionList
renderItem={({item}) =&gt; &lt;ListItem title={item} /&gt;}
docs/0.39/textinput.html
+1 -1
View File
@@ -501,7 +501,7 @@ the same value to position the cursor.</p>
</table>
<hr>
<h3><a class="anchor" aria-hidden="true" name="style"></a><a href="#style" aria-hidden="true" class="hash-link" ><svg aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a><code>style</code></h3>
<p><a href="/react-native/style.md">Styles</a></p>
<p><a href="/react-native/docs/0.39/style.html">Styles</a></p>
<table>
<thead>
<tr><th>Type</th><th>Required</th></tr>
docs/0.39/virtualizedlist.html
+1 -1
View File
@@ -1,4 +1,4 @@
<html><head><meta charset="utf-8"/><meta http-equiv="X-UA-Compatible" content="IE=edge, chrome=1"/><title>VirtualizedList · React Native</title><meta name="viewport" content="width=device-width"/><meta name="generator" content="Docusaurus"/><meta property="og:title" content="VirtualizedList · React Native"/><meta property="og:type" content="website"/><meta property="og:url" content="https://facebook.github.io/react-native/index.html"/><meta property="og:description" content="Base implementation for the more convenient [`&lt;FlatList&gt;`](/react-native/flatlist.md) and [`&lt;SectionList&gt;`](/react-native/sectionlist.md) components, which are also better documented. In general, this should only really be used if you need more flexibility than `FlatList` provides, e.g. for use with immutable data instead of plain arrays."/><link rel="shortcut icon" href="/react-native/img/favicon.png"/><link rel="stylesheet" href="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.css"/><link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/solarized-dark.min.css"/><link rel="alternate" type="application/atom+xml" href="https://facebook.github.io/blog/atom.xml" title="React Native Blog ATOM Feed"/><link rel="alternate" type="application/rss+xml" href="https://facebook.github.io/blog/feed.xml" title="React Native Blog RSS Feed"/><script type="text/javascript" src="https://snack.expo.io/embed.js"></script><script type="text/javascript" src="/react-native/js/codeblocks.js"></script><link rel="stylesheet" href="/react-native/css/main.css"/></head><body class="sideNavVisible"><div class="fixedHeaderContainer"><div class="headerWrapper wrapper"><header><a href="/react-native/"><img class="logo" src="/react-native/img/header_logo.png"/><h2 class="headerTitle">React Native</h2></a><a href="/react-native/versions.html"><h3>0.39</h3></a><div class="navigationWrapper navigationSlider"><nav class="slidingNav"><ul class="nav-site nav-site-internal"><li><a href="/react-native/docs/0.39/getting-started.html" target="_self">Docs</a></li><li><a href="/react-native/en/help.html" target="_self">Community</a></li><li><a href="/react-native/blog" target="_self">Blog</a></li><li class="navSearchWrapper reactNavSearchWrapper"><input type="text" id="search_input_react" placeholder="Search"/></li><li><a href="https://github.com/facebook/react-native" target="_self">GitHub</a></li><li><a href="https://reactjs.org/" target="_self">React</a></li></ul></nav></div></header></div></div><div class="navPusher"><div class="docMainWrapper wrapper"><div class="container mainContainer"><div class="wrapper"><div class="post"><header class="postHeader"><a class="edit-page-link button" href="https://github.com/facebook/react-native-website/blob/master/website/versioned_docs/version-0.5/virtualizedlist.md" target="_blank">Edit</a><h1>VirtualizedList</h1></header><article><div><span><p>Base implementation for the more convenient <a href="/react-native/flatlist.md"><code>&lt;FlatList&gt;</code></a> and <a href="/react-native/sectionlist.md"><code>&lt;SectionList&gt;</code></a> components, which are also better documented. In general, this should only really be used if you need more flexibility than <code>FlatList</code> provides, e.g. for use with immutable data instead of plain arrays.</p>
<html><head><meta charset="utf-8"/><meta http-equiv="X-UA-Compatible" content="IE=edge, chrome=1"/><title>VirtualizedList · React Native</title><meta name="viewport" content="width=device-width"/><meta name="generator" content="Docusaurus"/><meta property="og:title" content="VirtualizedList · React Native"/><meta property="og:type" content="website"/><meta property="og:url" content="https://facebook.github.io/react-native/index.html"/><meta property="og:description" content="Base implementation for the more convenient [`&lt;FlatList&gt;`](/react-native/docs/0.39/flatlist.html) and [`&lt;SectionList&gt;`](/react-native/docs/0.39/sectionlist.html) components, which are also better documented. In general, this should only really be used if you need more flexibility than `FlatList` provides, e.g. for use with immutable data instead of plain arrays."/><link rel="shortcut icon" href="/react-native/img/favicon.png"/><link rel="stylesheet" href="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.css"/><link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/solarized-dark.min.css"/><link rel="alternate" type="application/atom+xml" href="https://facebook.github.io/blog/atom.xml" title="React Native Blog ATOM Feed"/><link rel="alternate" type="application/rss+xml" href="https://facebook.github.io/blog/feed.xml" title="React Native Blog RSS Feed"/><script type="text/javascript" src="https://snack.expo.io/embed.js"></script><script type="text/javascript" src="/react-native/js/codeblocks.js"></script><link rel="stylesheet" href="/react-native/css/main.css"/></head><body class="sideNavVisible"><div class="fixedHeaderContainer"><div class="headerWrapper wrapper"><header><a href="/react-native/"><img class="logo" src="/react-native/img/header_logo.png"/><h2 class="headerTitle">React Native</h2></a><a href="/react-native/versions.html"><h3>0.39</h3></a><div class="navigationWrapper navigationSlider"><nav class="slidingNav"><ul class="nav-site nav-site-internal"><li><a href="/react-native/docs/0.39/getting-started.html" target="_self">Docs</a></li><li><a href="/react-native/en/help.html" target="_self">Community</a></li><li><a href="/react-native/blog" target="_self">Blog</a></li><li class="navSearchWrapper reactNavSearchWrapper"><input type="text" id="search_input_react" placeholder="Search"/></li><li><a href="https://github.com/facebook/react-native" target="_self">GitHub</a></li><li><a href="https://reactjs.org/" target="_self">React</a></li></ul></nav></div></header></div></div><div class="navPusher"><div class="docMainWrapper wrapper"><div class="container mainContainer"><div class="wrapper"><div class="post"><header class="postHeader"><a class="edit-page-link button" href="https://github.com/facebook/react-native-website/blob/master/website/versioned_docs/version-0.5/virtualizedlist.md" target="_blank">Edit</a><h1>VirtualizedList</h1></header><article><div><span><p>Base implementation for the more convenient <a href="/react-native/docs/0.39/flatlist.html"><code>&lt;FlatList&gt;</code></a> and <a href="/react-native/docs/0.39/sectionlist.html"><code>&lt;SectionList&gt;</code></a> components, which are also better documented. In general, this should only really be used if you need more flexibility than <code>FlatList</code> provides, e.g. for use with immutable data instead of plain arrays.</p>
<p>Virtualization massively improves memory consumption and performance of large lists by maintaining a finite render window of active items and replacing all items outside of the render window with appropriately sized blank space. The window adapts to scrolling behavior, and items are rendered incrementally with low-pri (after any running interactions) if they are far from the visible area, or with hi-pri otherwise to minimize the potential of seeing blank space.</p>
<p>Some caveats:</p>
<ul>
docs/0.40/navigatorios.html
+1 -1
View File
@@ -10,7 +10,7 @@ enabling you to implement a navigation stack. It works exactly the same as it
would on a native app using <code>UINavigationController</code>, providing the same
animations and behavior from UIKIt.</p>
<p>As the name implies, it is only available on iOS. Take a look at
<a href="/react-native/navigator.md"><code>Navigator</code></a> for a similar solution for your
<a href="navigator.md"><code>Navigator</code></a> for a similar solution for your
cross-platform needs, or check out
<a href="https://github.com/wix/react-native-navigation">react-native-navigation</a>, a
component that aims to provide native navigation on both iOS and Android.</p>
docs/0.40/sectionlist.html
+1 -1
View File
@@ -12,7 +12,7 @@
<li>Scroll loading.</li>
</ul>
<p>If you don't need section support and want a simpler interface, use
<a href="/react-native/flatlist.md"><code>&lt;FlatList&gt;</code></a>.</p>
<a href="/react-native/docs/0.40/flatlist.html"><code>&lt;FlatList&gt;</code></a>.</p>
<p>Simple Examples:</p>
<pre><code class="hljs css javascript">&lt;SectionList
renderItem={({item}) =&gt; &lt;ListItem title={item} /&gt;}
docs/0.40/textinput.html
+1 -1
View File
@@ -503,7 +503,7 @@ the same value to position the cursor.</p>
</table>
<hr>
<h3><a class="anchor" aria-hidden="true" name="style"></a><a href="#style" aria-hidden="true" class="hash-link" ><svg aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a><code>style</code></h3>
<p><a href="/react-native/style.md">Styles</a></p>
<p><a href="/react-native/docs/0.40/style.html">Styles</a></p>
<table>
<thead>
<tr><th>Type</th><th>Required</th></tr>
docs/0.40/virtualizedlist.html
+1 -1
View File
@@ -1,4 +1,4 @@
<html><head><meta charset="utf-8"/><meta http-equiv="X-UA-Compatible" content="IE=edge, chrome=1"/><title>VirtualizedList · React Native</title><meta name="viewport" content="width=device-width"/><meta name="generator" content="Docusaurus"/><meta property="og:title" content="VirtualizedList · React Native"/><meta property="og:type" content="website"/><meta property="og:url" content="https://facebook.github.io/react-native/index.html"/><meta property="og:description" content="Base implementation for the more convenient [`&lt;FlatList&gt;`](/react-native/flatlist.md) and [`&lt;SectionList&gt;`](/react-native/sectionlist.md) components, which are also better documented. In general, this should only really be used if you need more flexibility than `FlatList` provides, e.g. for use with immutable data instead of plain arrays."/><link rel="shortcut icon" href="/react-native/img/favicon.png"/><link rel="stylesheet" href="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.css"/><link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/solarized-dark.min.css"/><link rel="alternate" type="application/atom+xml" href="https://facebook.github.io/blog/atom.xml" title="React Native Blog ATOM Feed"/><link rel="alternate" type="application/rss+xml" href="https://facebook.github.io/blog/feed.xml" title="React Native Blog RSS Feed"/><script type="text/javascript" src="https://snack.expo.io/embed.js"></script><script type="text/javascript" src="/react-native/js/codeblocks.js"></script><link rel="stylesheet" href="/react-native/css/main.css"/></head><body class="sideNavVisible"><div class="fixedHeaderContainer"><div class="headerWrapper wrapper"><header><a href="/react-native/"><img class="logo" src="/react-native/img/header_logo.png"/><h2 class="headerTitle">React Native</h2></a><a href="/react-native/versions.html"><h3>0.40</h3></a><div class="navigationWrapper navigationSlider"><nav class="slidingNav"><ul class="nav-site nav-site-internal"><li><a href="/react-native/docs/0.40/getting-started.html" target="_self">Docs</a></li><li><a href="/react-native/en/help.html" target="_self">Community</a></li><li><a href="/react-native/blog" target="_self">Blog</a></li><li class="navSearchWrapper reactNavSearchWrapper"><input type="text" id="search_input_react" placeholder="Search"/></li><li><a href="https://github.com/facebook/react-native" target="_self">GitHub</a></li><li><a href="https://reactjs.org/" target="_self">React</a></li></ul></nav></div></header></div></div><div class="navPusher"><div class="docMainWrapper wrapper"><div class="container mainContainer"><div class="wrapper"><div class="post"><header class="postHeader"><a class="edit-page-link button" href="https://github.com/facebook/react-native-website/blob/master/website/versioned_docs/version-0.5/virtualizedlist.md" target="_blank">Edit</a><h1>VirtualizedList</h1></header><article><div><span><p>Base implementation for the more convenient <a href="/react-native/flatlist.md"><code>&lt;FlatList&gt;</code></a> and <a href="/react-native/sectionlist.md"><code>&lt;SectionList&gt;</code></a> components, which are also better documented. In general, this should only really be used if you need more flexibility than <code>FlatList</code> provides, e.g. for use with immutable data instead of plain arrays.</p>
<html><head><meta charset="utf-8"/><meta http-equiv="X-UA-Compatible" content="IE=edge, chrome=1"/><title>VirtualizedList · React Native</title><meta name="viewport" content="width=device-width"/><meta name="generator" content="Docusaurus"/><meta property="og:title" content="VirtualizedList · React Native"/><meta property="og:type" content="website"/><meta property="og:url" content="https://facebook.github.io/react-native/index.html"/><meta property="og:description" content="Base implementation for the more convenient [`&lt;FlatList&gt;`](/react-native/docs/0.40/flatlist.html) and [`&lt;SectionList&gt;`](/react-native/docs/0.40/sectionlist.html) components, which are also better documented. In general, this should only really be used if you need more flexibility than `FlatList` provides, e.g. for use with immutable data instead of plain arrays."/><link rel="shortcut icon" href="/react-native/img/favicon.png"/><link rel="stylesheet" href="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.css"/><link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/solarized-dark.min.css"/><link rel="alternate" type="application/atom+xml" href="https://facebook.github.io/blog/atom.xml" title="React Native Blog ATOM Feed"/><link rel="alternate" type="application/rss+xml" href="https://facebook.github.io/blog/feed.xml" title="React Native Blog RSS Feed"/><script type="text/javascript" src="https://snack.expo.io/embed.js"></script><script type="text/javascript" src="/react-native/js/codeblocks.js"></script><link rel="stylesheet" href="/react-native/css/main.css"/></head><body class="sideNavVisible"><div class="fixedHeaderContainer"><div class="headerWrapper wrapper"><header><a href="/react-native/"><img class="logo" src="/react-native/img/header_logo.png"/><h2 class="headerTitle">React Native</h2></a><a href="/react-native/versions.html"><h3>0.40</h3></a><div class="navigationWrapper navigationSlider"><nav class="slidingNav"><ul class="nav-site nav-site-internal"><li><a href="/react-native/docs/0.40/getting-started.html" target="_self">Docs</a></li><li><a href="/react-native/en/help.html" target="_self">Community</a></li><li><a href="/react-native/blog" target="_self">Blog</a></li><li class="navSearchWrapper reactNavSearchWrapper"><input type="text" id="search_input_react" placeholder="Search"/></li><li><a href="https://github.com/facebook/react-native" target="_self">GitHub</a></li><li><a href="https://reactjs.org/" target="_self">React</a></li></ul></nav></div></header></div></div><div class="navPusher"><div class="docMainWrapper wrapper"><div class="container mainContainer"><div class="wrapper"><div class="post"><header class="postHeader"><a class="edit-page-link button" href="https://github.com/facebook/react-native-website/blob/master/website/versioned_docs/version-0.5/virtualizedlist.md" target="_blank">Edit</a><h1>VirtualizedList</h1></header><article><div><span><p>Base implementation for the more convenient <a href="/react-native/docs/0.40/flatlist.html"><code>&lt;FlatList&gt;</code></a> and <a href="/react-native/docs/0.40/sectionlist.html"><code>&lt;SectionList&gt;</code></a> components, which are also better documented. In general, this should only really be used if you need more flexibility than <code>FlatList</code> provides, e.g. for use with immutable data instead of plain arrays.</p>
<p>Virtualization massively improves memory consumption and performance of large lists by maintaining a finite render window of active items and replacing all items outside of the render window with appropriately sized blank space. The window adapts to scrolling behavior, and items are rendered incrementally with low-pri (after any running interactions) if they are far from the visible area, or with hi-pri otherwise to minimize the potential of seeing blank space.</p>
<p>Some caveats:</p>
<ul>
docs/0.41/navigatorios.html
+1 -1
View File
@@ -10,7 +10,7 @@ enabling you to implement a navigation stack. It works exactly the same as it
would on a native app using <code>UINavigationController</code>, providing the same
animations and behavior from UIKIt.</p>
<p>As the name implies, it is only available on iOS. Take a look at
<a href="/react-native/navigator.md"><code>Navigator</code></a> for a similar solution for your
<a href="navigator.md"><code>Navigator</code></a> for a similar solution for your
cross-platform needs, or check out
<a href="https://github.com/wix/react-native-navigation">react-native-navigation</a>, a
component that aims to provide native navigation on both iOS and Android.</p>
docs/0.41/sectionlist.html
+1 -1
View File
@@ -12,7 +12,7 @@
<li>Scroll loading.</li>
</ul>
<p>If you don't need section support and want a simpler interface, use
<a href="/react-native/flatlist.md"><code>&lt;FlatList&gt;</code></a>.</p>
<a href="/react-native/docs/0.41/flatlist.html"><code>&lt;FlatList&gt;</code></a>.</p>
<p>Simple Examples:</p>
<pre><code class="hljs css javascript">&lt;SectionList
renderItem={({item}) =&gt; &lt;ListItem title={item} /&gt;}
docs/0.41/textinput.html
+1 -1
View File
@@ -507,7 +507,7 @@ the same value to position the cursor.</p>
<p>Note that not all Text styles are supported,
see <a href="https://github.com/facebook/react-native/issues/7070">Issue#7070</a>
for more detail.</p>
<p><a href="/react-native/style.md">Styles</a></p>
<p><a href="/react-native/docs/0.41/style.html">Styles</a></p>
<table>
<thead>
<tr><th>Type</th><th>Required</th></tr>
docs/0.41/virtualizedlist.html
+1 -1
View File
@@ -1,4 +1,4 @@
<html><head><meta charset="utf-8"/><meta http-equiv="X-UA-Compatible" content="IE=edge, chrome=1"/><title>VirtualizedList · React Native</title><meta name="viewport" content="width=device-width"/><meta name="generator" content="Docusaurus"/><meta property="og:title" content="VirtualizedList · React Native"/><meta property="og:type" content="website"/><meta property="og:url" content="https://facebook.github.io/react-native/index.html"/><meta property="og:description" content="Base implementation for the more convenient [`&lt;FlatList&gt;`](/react-native/flatlist.md) and [`&lt;SectionList&gt;`](/react-native/sectionlist.md) components, which are also better documented. In general, this should only really be used if you need more flexibility than `FlatList` provides, e.g. for use with immutable data instead of plain arrays."/><link rel="shortcut icon" href="/react-native/img/favicon.png"/><link rel="stylesheet" href="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.css"/><link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/solarized-dark.min.css"/><link rel="alternate" type="application/atom+xml" href="https://facebook.github.io/blog/atom.xml" title="React Native Blog ATOM Feed"/><link rel="alternate" type="application/rss+xml" href="https://facebook.github.io/blog/feed.xml" title="React Native Blog RSS Feed"/><script type="text/javascript" src="https://snack.expo.io/embed.js"></script><script type="text/javascript" src="/react-native/js/codeblocks.js"></script><link rel="stylesheet" href="/react-native/css/main.css"/></head><body class="sideNavVisible"><div class="fixedHeaderContainer"><div class="headerWrapper wrapper"><header><a href="/react-native/"><img class="logo" src="/react-native/img/header_logo.png"/><h2 class="headerTitle">React Native</h2></a><a href="/react-native/versions.html"><h3>0.41</h3></a><div class="navigationWrapper navigationSlider"><nav class="slidingNav"><ul class="nav-site nav-site-internal"><li><a href="/react-native/docs/0.41/getting-started.html" target="_self">Docs</a></li><li><a href="/react-native/en/help.html" target="_self">Community</a></li><li><a href="/react-native/blog" target="_self">Blog</a></li><li class="navSearchWrapper reactNavSearchWrapper"><input type="text" id="search_input_react" placeholder="Search"/></li><li><a href="https://github.com/facebook/react-native" target="_self">GitHub</a></li><li><a href="https://reactjs.org/" target="_self">React</a></li></ul></nav></div></header></div></div><div class="navPusher"><div class="docMainWrapper wrapper"><div class="container mainContainer"><div class="wrapper"><div class="post"><header class="postHeader"><a class="edit-page-link button" href="https://github.com/facebook/react-native-website/blob/master/website/versioned_docs/version-0.5/virtualizedlist.md" target="_blank">Edit</a><h1>VirtualizedList</h1></header><article><div><span><p>Base implementation for the more convenient <a href="/react-native/flatlist.md"><code>&lt;FlatList&gt;</code></a> and <a href="/react-native/sectionlist.md"><code>&lt;SectionList&gt;</code></a> components, which are also better documented. In general, this should only really be used if you need more flexibility than <code>FlatList</code> provides, e.g. for use with immutable data instead of plain arrays.</p>
<html><head><meta charset="utf-8"/><meta http-equiv="X-UA-Compatible" content="IE=edge, chrome=1"/><title>VirtualizedList · React Native</title><meta name="viewport" content="width=device-width"/><meta name="generator" content="Docusaurus"/><meta property="og:title" content="VirtualizedList · React Native"/><meta property="og:type" content="website"/><meta property="og:url" content="https://facebook.github.io/react-native/index.html"/><meta property="og:description" content="Base implementation for the more convenient [`&lt;FlatList&gt;`](/react-native/docs/0.41/flatlist.html) and [`&lt;SectionList&gt;`](/react-native/docs/0.41/sectionlist.html) components, which are also better documented. In general, this should only really be used if you need more flexibility than `FlatList` provides, e.g. for use with immutable data instead of plain arrays."/><link rel="shortcut icon" href="/react-native/img/favicon.png"/><link rel="stylesheet" href="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.css"/><link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/solarized-dark.min.css"/><link rel="alternate" type="application/atom+xml" href="https://facebook.github.io/blog/atom.xml" title="React Native Blog ATOM Feed"/><link rel="alternate" type="application/rss+xml" href="https://facebook.github.io/blog/feed.xml" title="React Native Blog RSS Feed"/><script type="text/javascript" src="https://snack.expo.io/embed.js"></script><script type="text/javascript" src="/react-native/js/codeblocks.js"></script><link rel="stylesheet" href="/react-native/css/main.css"/></head><body class="sideNavVisible"><div class="fixedHeaderContainer"><div class="headerWrapper wrapper"><header><a href="/react-native/"><img class="logo" src="/react-native/img/header_logo.png"/><h2 class="headerTitle">React Native</h2></a><a href="/react-native/versions.html"><h3>0.41</h3></a><div class="navigationWrapper navigationSlider"><nav class="slidingNav"><ul class="nav-site nav-site-internal"><li><a href="/react-native/docs/0.41/getting-started.html" target="_self">Docs</a></li><li><a href="/react-native/en/help.html" target="_self">Community</a></li><li><a href="/react-native/blog" target="_self">Blog</a></li><li class="navSearchWrapper reactNavSearchWrapper"><input type="text" id="search_input_react" placeholder="Search"/></li><li><a href="https://github.com/facebook/react-native" target="_self">GitHub</a></li><li><a href="https://reactjs.org/" target="_self">React</a></li></ul></nav></div></header></div></div><div class="navPusher"><div class="docMainWrapper wrapper"><div class="container mainContainer"><div class="wrapper"><div class="post"><header class="postHeader"><a class="edit-page-link button" href="https://github.com/facebook/react-native-website/blob/master/website/versioned_docs/version-0.5/virtualizedlist.md" target="_blank">Edit</a><h1>VirtualizedList</h1></header><article><div><span><p>Base implementation for the more convenient <a href="/react-native/docs/0.41/flatlist.html"><code>&lt;FlatList&gt;</code></a> and <a href="/react-native/docs/0.41/sectionlist.html"><code>&lt;SectionList&gt;</code></a> components, which are also better documented. In general, this should only really be used if you need more flexibility than <code>FlatList</code> provides, e.g. for use with immutable data instead of plain arrays.</p>
<p>Virtualization massively improves memory consumption and performance of large lists by maintaining a finite render window of active items and replacing all items outside of the render window with appropriately sized blank space. The window adapts to scrolling behavior, and items are rendered incrementally with low-pri (after any running interactions) if they are far from the visible area, or with hi-pri otherwise to minimize the potential of seeing blank space.</p>
<p>Some caveats:</p>
<ul>
docs/0.42/sectionlist.html
+1 -1
View File
@@ -12,7 +12,7 @@
<li>Scroll loading.</li>
</ul>
<p>If you don't need section support and want a simpler interface, use
<a href="/react-native/flatlist.md"><code>&lt;FlatList&gt;</code></a>.</p>
<a href="/react-native/docs/0.42/flatlist.html"><code>&lt;FlatList&gt;</code></a>.</p>
<p>Simple Examples:</p>
<pre><code class="hljs css javascript">&lt;SectionList
renderItem={({item}) =&gt; &lt;ListItem title={item} /&gt;}
docs/0.42/virtualizedlist.html
+1 -1
View File
@@ -1,4 +1,4 @@
<html><head><meta charset="utf-8"/><meta http-equiv="X-UA-Compatible" content="IE=edge, chrome=1"/><title>VirtualizedList · React Native</title><meta name="viewport" content="width=device-width"/><meta name="generator" content="Docusaurus"/><meta property="og:title" content="VirtualizedList · React Native"/><meta property="og:type" content="website"/><meta property="og:url" content="https://facebook.github.io/react-native/index.html"/><meta property="og:description" content="Base implementation for the more convenient [`&lt;FlatList&gt;`](/react-native/flatlist.md) and [`&lt;SectionList&gt;`](/react-native/sectionlist.md) components, which are also better documented. In general, this should only really be used if you need more flexibility than `FlatList` provides, e.g. for use with immutable data instead of plain arrays."/><link rel="shortcut icon" href="/react-native/img/favicon.png"/><link rel="stylesheet" href="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.css"/><link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/solarized-dark.min.css"/><link rel="alternate" type="application/atom+xml" href="https://facebook.github.io/blog/atom.xml" title="React Native Blog ATOM Feed"/><link rel="alternate" type="application/rss+xml" href="https://facebook.github.io/blog/feed.xml" title="React Native Blog RSS Feed"/><script type="text/javascript" src="https://snack.expo.io/embed.js"></script><script type="text/javascript" src="/react-native/js/codeblocks.js"></script><link rel="stylesheet" href="/react-native/css/main.css"/></head><body class="sideNavVisible"><div class="fixedHeaderContainer"><div class="headerWrapper wrapper"><header><a href="/react-native/"><img class="logo" src="/react-native/img/header_logo.png"/><h2 class="headerTitle">React Native</h2></a><a href="/react-native/versions.html"><h3>0.42</h3></a><div class="navigationWrapper navigationSlider"><nav class="slidingNav"><ul class="nav-site nav-site-internal"><li><a href="/react-native/docs/0.42/getting-started.html" target="_self">Docs</a></li><li><a href="/react-native/en/help.html" target="_self">Community</a></li><li><a href="/react-native/blog" target="_self">Blog</a></li><li class="navSearchWrapper reactNavSearchWrapper"><input type="text" id="search_input_react" placeholder="Search"/></li><li><a href="https://github.com/facebook/react-native" target="_self">GitHub</a></li><li><a href="https://reactjs.org/" target="_self">React</a></li></ul></nav></div></header></div></div><div class="navPusher"><div class="docMainWrapper wrapper"><div class="container mainContainer"><div class="wrapper"><div class="post"><header class="postHeader"><a class="edit-page-link button" href="https://github.com/facebook/react-native-website/blob/master/website/versioned_docs/version-0.5/virtualizedlist.md" target="_blank">Edit</a><h1>VirtualizedList</h1></header><article><div><span><p>Base implementation for the more convenient <a href="/react-native/flatlist.md"><code>&lt;FlatList&gt;</code></a> and <a href="/react-native/sectionlist.md"><code>&lt;SectionList&gt;</code></a> components, which are also better documented. In general, this should only really be used if you need more flexibility than <code>FlatList</code> provides, e.g. for use with immutable data instead of plain arrays.</p>
<html><head><meta charset="utf-8"/><meta http-equiv="X-UA-Compatible" content="IE=edge, chrome=1"/><title>VirtualizedList · React Native</title><meta name="viewport" content="width=device-width"/><meta name="generator" content="Docusaurus"/><meta property="og:title" content="VirtualizedList · React Native"/><meta property="og:type" content="website"/><meta property="og:url" content="https://facebook.github.io/react-native/index.html"/><meta property="og:description" content="Base implementation for the more convenient [`&lt;FlatList&gt;`](/react-native/docs/0.42/flatlist.html) and [`&lt;SectionList&gt;`](/react-native/docs/0.42/sectionlist.html) components, which are also better documented. In general, this should only really be used if you need more flexibility than `FlatList` provides, e.g. for use with immutable data instead of plain arrays."/><link rel="shortcut icon" href="/react-native/img/favicon.png"/><link rel="stylesheet" href="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.css"/><link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/solarized-dark.min.css"/><link rel="alternate" type="application/atom+xml" href="https://facebook.github.io/blog/atom.xml" title="React Native Blog ATOM Feed"/><link rel="alternate" type="application/rss+xml" href="https://facebook.github.io/blog/feed.xml" title="React Native Blog RSS Feed"/><script type="text/javascript" src="https://snack.expo.io/embed.js"></script><script type="text/javascript" src="/react-native/js/codeblocks.js"></script><link rel="stylesheet" href="/react-native/css/main.css"/></head><body class="sideNavVisible"><div class="fixedHeaderContainer"><div class="headerWrapper wrapper"><header><a href="/react-native/"><img class="logo" src="/react-native/img/header_logo.png"/><h2 class="headerTitle">React Native</h2></a><a href="/react-native/versions.html"><h3>0.42</h3></a><div class="navigationWrapper navigationSlider"><nav class="slidingNav"><ul class="nav-site nav-site-internal"><li><a href="/react-native/docs/0.42/getting-started.html" target="_self">Docs</a></li><li><a href="/react-native/en/help.html" target="_self">Community</a></li><li><a href="/react-native/blog" target="_self">Blog</a></li><li class="navSearchWrapper reactNavSearchWrapper"><input type="text" id="search_input_react" placeholder="Search"/></li><li><a href="https://github.com/facebook/react-native" target="_self">GitHub</a></li><li><a href="https://reactjs.org/" target="_self">React</a></li></ul></nav></div></header></div></div><div class="navPusher"><div class="docMainWrapper wrapper"><div class="container mainContainer"><div class="wrapper"><div class="post"><header class="postHeader"><a class="edit-page-link button" href="https://github.com/facebook/react-native-website/blob/master/website/versioned_docs/version-0.5/virtualizedlist.md" target="_blank">Edit</a><h1>VirtualizedList</h1></header><article><div><span><p>Base implementation for the more convenient <a href="/react-native/docs/0.42/flatlist.html"><code>&lt;FlatList&gt;</code></a> and <a href="/react-native/docs/0.42/sectionlist.html"><code>&lt;SectionList&gt;</code></a> components, which are also better documented. In general, this should only really be used if you need more flexibility than <code>FlatList</code> provides, e.g. for use with immutable data instead of plain arrays.</p>
<p>Virtualization massively improves memory consumption and performance of large lists by maintaining a finite render window of active items and replacing all items outside of the render window with appropriately sized blank space. The window adapts to scrolling behavior, and items are rendered incrementally with low-pri (after any running interactions) if they are far from the visible area, or with hi-pri otherwise to minimize the potential of seeing blank space.</p>
<p>Some caveats:</p>
<ul>
docs/0.43/scrollview.html
+1 -1
View File
@@ -15,7 +15,7 @@ view stack can lead to errors here, which the element inspector makes
easy to debug.</p>
<p>Doesn't yet support other contained responders from blocking this scroll
view from becoming the responder.</p>
<p><code>&lt;ScrollView&gt;</code> vs <a href="/react-native/flatlist.md"><code>&lt;FlatList&gt;</code></a> - which one to use?</p>
<p><code>&lt;ScrollView&gt;</code> vs <a href="/react-native/docs/0.43/flatlist.html"><code>&lt;FlatList&gt;</code></a> - which one to use?</p>
<p><code>ScrollView</code> simply renders all its react child components at once. That
makes it very easy to understand and use.</p>
<p>On the other hand, this has a performance downside. Imagine you have a very
docs/0.43/sectionlist.html
+1 -1
View File
@@ -12,7 +12,7 @@
<li>Scroll loading.</li>
</ul>
<p>If you don't need section support and want a simpler interface, use
<a href="/react-native/flatlist.md"><code>&lt;FlatList&gt;</code></a>.</p>
<a href="/react-native/docs/0.43/flatlist.html"><code>&lt;FlatList&gt;</code></a>.</p>
<p>Simple Examples:</p>
<pre><code class="hljs css javascript">&lt;SectionList
renderItem={({item}) =&gt; &lt;ListItem title={item} /&gt;}
docs/0.43/virtualizedlist.html
+1 -1
View File
@@ -1,4 +1,4 @@
<html><head><meta charset="utf-8"/><meta http-equiv="X-UA-Compatible" content="IE=edge, chrome=1"/><title>VirtualizedList · React Native</title><meta name="viewport" content="width=device-width"/><meta name="generator" content="Docusaurus"/><meta property="og:title" content="VirtualizedList · React Native"/><meta property="og:type" content="website"/><meta property="og:url" content="https://facebook.github.io/react-native/index.html"/><meta property="og:description" content="Base implementation for the more convenient [`&lt;FlatList&gt;`](/react-native/flatlist.md) and [`&lt;SectionList&gt;`](/react-native/sectionlist.md) components, which are also better documented. In general, this should only really be used if you need more flexibility than `FlatList` provides, e.g. for use with immutable data instead of plain arrays."/><link rel="shortcut icon" href="/react-native/img/favicon.png"/><link rel="stylesheet" href="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.css"/><link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/solarized-dark.min.css"/><link rel="alternate" type="application/atom+xml" href="https://facebook.github.io/blog/atom.xml" title="React Native Blog ATOM Feed"/><link rel="alternate" type="application/rss+xml" href="https://facebook.github.io/blog/feed.xml" title="React Native Blog RSS Feed"/><script type="text/javascript" src="https://snack.expo.io/embed.js"></script><script type="text/javascript" src="/react-native/js/codeblocks.js"></script><link rel="stylesheet" href="/react-native/css/main.css"/></head><body class="sideNavVisible"><div class="fixedHeaderContainer"><div class="headerWrapper wrapper"><header><a href="/react-native/"><img class="logo" src="/react-native/img/header_logo.png"/><h2 class="headerTitle">React Native</h2></a><a href="/react-native/versions.html"><h3>0.43</h3></a><div class="navigationWrapper navigationSlider"><nav class="slidingNav"><ul class="nav-site nav-site-internal"><li><a href="/react-native/docs/0.43/getting-started.html" target="_self">Docs</a></li><li><a href="/react-native/en/help.html" target="_self">Community</a></li><li><a href="/react-native/blog" target="_self">Blog</a></li><li class="navSearchWrapper reactNavSearchWrapper"><input type="text" id="search_input_react" placeholder="Search"/></li><li><a href="https://github.com/facebook/react-native" target="_self">GitHub</a></li><li><a href="https://reactjs.org/" target="_self">React</a></li></ul></nav></div></header></div></div><div class="navPusher"><div class="docMainWrapper wrapper"><div class="container mainContainer"><div class="wrapper"><div class="post"><header class="postHeader"><a class="edit-page-link button" href="https://github.com/facebook/react-native-website/blob/master/website/versioned_docs/version-0.5/virtualizedlist.md" target="_blank">Edit</a><h1>VirtualizedList</h1></header><article><div><span><p>Base implementation for the more convenient <a href="/react-native/flatlist.md"><code>&lt;FlatList&gt;</code></a> and <a href="/react-native/sectionlist.md"><code>&lt;SectionList&gt;</code></a> components, which are also better documented. In general, this should only really be used if you need more flexibility than <code>FlatList</code> provides, e.g. for use with immutable data instead of plain arrays.</p>
<html><head><meta charset="utf-8"/><meta http-equiv="X-UA-Compatible" content="IE=edge, chrome=1"/><title>VirtualizedList · React Native</title><meta name="viewport" content="width=device-width"/><meta name="generator" content="Docusaurus"/><meta property="og:title" content="VirtualizedList · React Native"/><meta property="og:type" content="website"/><meta property="og:url" content="https://facebook.github.io/react-native/index.html"/><meta property="og:description" content="Base implementation for the more convenient [`&lt;FlatList&gt;`](/react-native/docs/0.43/flatlist.html) and [`&lt;SectionList&gt;`](/react-native/docs/0.43/sectionlist.html) components, which are also better documented. In general, this should only really be used if you need more flexibility than `FlatList` provides, e.g. for use with immutable data instead of plain arrays."/><link rel="shortcut icon" href="/react-native/img/favicon.png"/><link rel="stylesheet" href="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.css"/><link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/solarized-dark.min.css"/><link rel="alternate" type="application/atom+xml" href="https://facebook.github.io/blog/atom.xml" title="React Native Blog ATOM Feed"/><link rel="alternate" type="application/rss+xml" href="https://facebook.github.io/blog/feed.xml" title="React Native Blog RSS Feed"/><script type="text/javascript" src="https://snack.expo.io/embed.js"></script><script type="text/javascript" src="/react-native/js/codeblocks.js"></script><link rel="stylesheet" href="/react-native/css/main.css"/></head><body class="sideNavVisible"><div class="fixedHeaderContainer"><div class="headerWrapper wrapper"><header><a href="/react-native/"><img class="logo" src="/react-native/img/header_logo.png"/><h2 class="headerTitle">React Native</h2></a><a href="/react-native/versions.html"><h3>0.43</h3></a><div class="navigationWrapper navigationSlider"><nav class="slidingNav"><ul class="nav-site nav-site-internal"><li><a href="/react-native/docs/0.43/getting-started.html" target="_self">Docs</a></li><li><a href="/react-native/en/help.html" target="_self">Community</a></li><li><a href="/react-native/blog" target="_self">Blog</a></li><li class="navSearchWrapper reactNavSearchWrapper"><input type="text" id="search_input_react" placeholder="Search"/></li><li><a href="https://github.com/facebook/react-native" target="_self">GitHub</a></li><li><a href="https://reactjs.org/" target="_self">React</a></li></ul></nav></div></header></div></div><div class="navPusher"><div class="docMainWrapper wrapper"><div class="container mainContainer"><div class="wrapper"><div class="post"><header class="postHeader"><a class="edit-page-link button" href="https://github.com/facebook/react-native-website/blob/master/website/versioned_docs/version-0.5/virtualizedlist.md" target="_blank">Edit</a><h1>VirtualizedList</h1></header><article><div><span><p>Base implementation for the more convenient <a href="/react-native/docs/0.43/flatlist.html"><code>&lt;FlatList&gt;</code></a> and <a href="/react-native/docs/0.43/sectionlist.html"><code>&lt;SectionList&gt;</code></a> components, which are also better documented. In general, this should only really be used if you need more flexibility than <code>FlatList</code> provides, e.g. for use with immutable data instead of plain arrays.</p>
<p>Virtualization massively improves memory consumption and performance of large lists by maintaining a finite render window of active items and replacing all items outside of the render window with appropriately sized blank space. The window adapts to scrolling behavior, and items are rendered incrementally with low-pri (after any running interactions) if they are far from the visible area, or with hi-pri otherwise to minimize the potential of seeing blank space.</p>
<p>Some caveats:</p>
<ul>

Some files were not shown because too many files have changed in this diff Show More