mirror of
https://github.com/facebook/react-native.git
synced 2025-11-01 09:14:26 +00:00
Website Deployment Script
45 lines
73 KiB
HTML
45 lines
73 KiB
HTML
<!doctype html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width,initial-scale=1">
|
|
<meta name="generator" content="Docusaurus v2.0.0-alpha.66">
|
|
<link rel="alternate" type="application/rss+xml" href="/blog/rss.xml" title="React Native Blog RSS Feed">
|
|
<link rel="alternate" type="application/atom+xml" href="/blog/atom.xml" title="React Native Blog Atom Feed">
|
|
<link rel="preconnect" href="https://www.google-analytics.com">
|
|
<script>window.ga=window.ga||function(){(ga.q=ga.q||[]).push(arguments)},ga.l=+new Date,ga("create","UA-41298772-2","auto"),ga("send","pageview")</script>
|
|
<script async src="https://www.google-analytics.com/analytics.js"></script>
|
|
<link rel="preconnect" href="https://www.google-analytics.com">
|
|
<link rel="preconnect" href="https://www.googletagmanager.com">
|
|
<script async src="https://www.googletagmanager.com/gtag/js?id=UA-41298772-2"></script>
|
|
<script>function gtag(){dataLayer.push(arguments)}window.dataLayer=window.dataLayer||[],gtag("js",new Date),gtag("config","UA-41298772-2",{})</script>
|
|
<link rel="search" type="application/opensearchdescription+xml" title="React Native" href="/opensearch.xml">
|
|
<script src="https://cdn.jsdelivr.net/npm/focus-visible@5.2.0/dist/focus-visible.min.js" defer="defer"></script>
|
|
<script src="https://snack.expo.io/embed.js" defer="defer"></script><title data-react-helmet="true">TextInput · React Native</title><meta data-react-helmet="true" property="twitter:image" content="https://reactnative.dev/img/logo-og.png"><meta data-react-helmet="true" name="twitter:image:alt" content="Image for React Native"><meta data-react-helmet="true" name="docsearch:language" content="en"><meta data-react-helmet="true" name="docsearch:version" content="0.63"><meta data-react-helmet="true" name="docsearch:docusaurus_tag" content="docs-default-0.63"><meta data-react-helmet="true" property="og:image" content="https://reactnative.dev/img/logo-og.png"><meta data-react-helmet="true" name="twitter:card" content="summary"><meta data-react-helmet="true" name="twitter:image" content="https://reactnative.dev/img/logo-og.png"><meta data-react-helmet="true" property="og:title" content="TextInput · React Native"><meta data-react-helmet="true" name="description" content="A foundational component for inputting text into the app via a keyboard. Props provide configurability for several features, such as auto-correction, auto-capitalization, placeholder text, and different keyboard types, such as a numeric keypad."><meta data-react-helmet="true" property="og:description" content="A foundational component for inputting text into the app via a keyboard. Props provide configurability for several features, such as auto-correction, auto-capitalization, placeholder text, and different keyboard types, such as a numeric keypad."><meta data-react-helmet="true" property="og:url" content="https://reactnative.dev/docs/textinput"><link data-react-helmet="true" rel="shortcut icon" href="/img/favicon.ico"><link data-react-helmet="true" rel="preconnect" href="https://BH4D9OD16A-dsn.algolia.net" crossorigin="anonymous"><link data-react-helmet="true" rel="canonical" href="https://reactnative.dev/docs/textinput"><link rel="stylesheet" href="/styles.fccefeba.css">
|
|
<link rel="stylesheet" href="/main.ca40cabd.css">
|
|
<link rel="preload" href="/styles.07d522c6.js" as="script">
|
|
<link rel="preload" href="/runtime~main.0f285a6b.js" as="script">
|
|
<link rel="preload" href="/main.5e05a427.js" as="script">
|
|
<link rel="preload" href="/1.ba9ce8bd.js" as="script">
|
|
<link rel="preload" href="/2.58cb5d3d.js" as="script">
|
|
<link rel="preload" href="/1f391b9e.a824c215.js" as="script">
|
|
<link rel="preload" href="/943.8b024446.js" as="script">
|
|
<link rel="preload" href="/ee5b3385.b4fff665.js" as="script">
|
|
<link rel="preload" href="/17896441.0c201679.js" as="script">
|
|
<link rel="preload" href="/0fc9f0f5.d7050848.js" as="script">
|
|
</head>
|
|
<body>
|
|
<script>!function(){function t(t){document.documentElement.setAttribute("data-theme",t)}var e=function(){var t=null;try{t=localStorage.getItem("theme")}catch(t){}return t}();t(null!==e?e:"light")}()</script><div id="__docusaurus">
|
|
<nav class="navbar navbar--fixed-top navbar--dark"><div class="navbar__inner"><div class="navbar__items"><div aria-label="Navigation bar toggle" class="navbar__toggle" role="button" tabindex="0"><svg xmlns="http://www.w3.org/2000/svg" width="30" height="30" viewBox="0 0 30 30" role="img" focusable="false"><title>Menu</title><path stroke="currentColor" stroke-linecap="round" stroke-miterlimit="10" stroke-width="2" d="M4 7h22M4 15h22M4 23h22"></path></svg></div><a class="navbar__brand" href="/"><img class="navbar__logo" src="/img/header_logo.svg" alt="React Native"><strong class="navbar__title">React Native</strong></a><div class="navbar__item dropdown dropdown--hoverable dropdown--left"><a class="navbar__item navbar__link" href="/docs/getting-started">0.63</a><ul class="dropdown__menu"><li><a class="dropdown__link" href="/docs/next/textinput">Next</a></li><li><a aria-current="page" class="dropdown__link dropdown__link--active" href="/docs/textinput">0.63</a></li><li><a class="dropdown__link" href="/docs/0.62/textinput">0.62</a></li><li><a class="dropdown__link" href="/docs/0.61/textinput">0.61</a></li><li><a class="dropdown__link" href="/docs/0.60/textinput">0.60</a></li><li><a class="dropdown__link" href="/versions">All versions</a></li></ul></div></div><div class="navbar__items navbar__items--right"><a class="navbar__item navbar__link" href="/docs/getting-started">Docs</a><a class="navbar__item navbar__link navbar__link--active" href="/docs/components-and-apis">Components</a><a class="navbar__item navbar__link" href="/docs/accessibilityinfo">API</a><a class="navbar__item navbar__link" href="/help">Community</a><a class="navbar__item navbar__link" href="/blog">Blog</a><a href="https://github.com/facebook/react-native" target="_blank" rel="noopener noreferrer" class="navbar__item navbar__link navbar-github-link" aria-label="GitHub repository"></a><div class="react-toggle react-toggle--disabled displayOnlyInLargeViewport_3lWe"><div class="react-toggle-track"><div class="react-toggle-track-check"><span class="toggle_gnXW">🌜</span></div><div class="react-toggle-track-x"><span class="toggle_gnXW">🌞</span></div></div><div class="react-toggle-thumb"></div><input type="checkbox" disabled="" aria-label="Dark mode toggle" class="react-toggle-screenreader-only"></div><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><svg width="20" height="20" class="DocSearch-Search-Icon" viewBox="0 0 20 20"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span><span class="DocSearch-Button-Key">⌘</span><span class="DocSearch-Button-Key">K</span></button></div></div><div role="presentation" class="navbar-sidebar__backdrop"></div><div class="navbar-sidebar"><div class="navbar-sidebar__brand"><a class="navbar__brand" href="/"><img class="navbar__logo" src="/img/header_logo.svg" alt="React Native"><strong class="navbar__title">React Native</strong></a></div><div class="navbar-sidebar__items"><div class="menu"><ul class="menu__list"><li class="menu__list-item"><a class="menu__link" href="/docs/getting-started">Docs</a></li><li class="menu__list-item"><a class="menu__link navbar__link--active" href="/docs/components-and-apis">Components</a></li><li class="menu__list-item"><a class="menu__link" href="/docs/accessibilityinfo">API</a></li><li class="menu__list-item"><a class="menu__link" href="/help">Community</a></li><li class="menu__list-item"><a class="menu__link" href="/blog">Blog</a></li><li class="menu__list-item"><a role="button" class="menu__link menu__link--sublist">Versions</a><ul class="menu__list"><li class="menu__list-item"><a class="menu__link" href="/docs/next/textinput">Next</a></li><li class="menu__list-item"><a aria-current="page" class="menu__link menu__link--active" href="/docs/textinput">0.63</a></li><li class="menu__list-item"><a class="menu__link" href="/docs/0.62/textinput">0.62</a></li><li class="menu__list-item"><a class="menu__link" href="/docs/0.61/textinput">0.61</a></li><li class="menu__list-item"><a class="menu__link" href="/docs/0.60/textinput">0.60</a></li><li class="menu__list-item"><a class="menu__link" href="/versions">All versions</a></li></ul></li><li class="menu__list-item"><a href="https://github.com/facebook/react-native" target="_blank" rel="noopener noreferrer" class="menu__link navbar-github-link" aria-label="GitHub repository"></a></li></ul></div></div></div></nav><div class="main-wrapper"><div class="docPage_2UBv"><div class="docSidebarContainer_1hqR" role="complementary"><div class="sidebar_MSwm"><div class="menu menu--responsive menu_2hiu"><button aria-label="Open Menu" aria-haspopup="true" class="button button--secondary button--sm menu__button" type="button"><svg aria-label="Menu" class="sidebarMenuIcon_37TU" xmlns="http://www.w3.org/2000/svg" height="24" width="24" viewBox="0 0 32 32" role="img" focusable="false"><title>Menu</title><path stroke="currentColor" stroke-linecap="round" stroke-miterlimit="10" stroke-width="2" d="M4 7h22M4 15h22M4 23h22"></path></svg></button><ul class="menu__list"><li class="menu__list-item"><a class="menu__link menu__link--sublist menu__link--active" href="#!">Core Components</a><ul class="menu__list"><li class="menu__list-item"><a class="menu__link" tabindex="0" href="/docs/components-and-apis">Core Components and APIs</a></li><li class="menu__list-item"><a class="menu__link" tabindex="0" href="/docs/activityindicator">ActivityIndicator</a></li><li class="menu__list-item"><a class="menu__link" tabindex="0" href="/docs/button">Button</a></li><li class="menu__list-item"><a class="menu__link" tabindex="0" href="/docs/flatlist">FlatList</a></li><li class="menu__list-item"><a class="menu__link" tabindex="0" href="/docs/image">Image</a></li><li class="menu__list-item"><a class="menu__link" tabindex="0" href="/docs/imagebackground">ImageBackground</a></li><li class="menu__list-item"><a class="menu__link" tabindex="0" href="/docs/keyboardavoidingview">KeyboardAvoidingView</a></li><li class="menu__list-item"><a class="menu__link" tabindex="0" href="/docs/modal">Modal</a></li><li class="menu__list-item"><a class="menu__link" tabindex="0" href="/docs/pressable">Pressable</a></li><li class="menu__list-item"><a class="menu__link" tabindex="0" href="/docs/refreshcontrol">RefreshControl</a></li><li class="menu__list-item"><a class="menu__link" tabindex="0" href="/docs/scrollview">ScrollView</a></li><li class="menu__list-item"><a class="menu__link" tabindex="0" href="/docs/sectionlist">SectionList</a></li><li class="menu__list-item"><a class="menu__link" tabindex="0" href="/docs/statusbar">StatusBar</a></li><li class="menu__list-item"><a class="menu__link" tabindex="0" href="/docs/switch">Switch</a></li><li class="menu__list-item"><a class="menu__link" tabindex="0" href="/docs/text">Text</a></li><li class="menu__list-item"><a aria-current="page" class="menu__link menu__link--active active" tabindex="0" href="/docs/textinput">TextInput</a></li><li class="menu__list-item"><a class="menu__link" tabindex="0" href="/docs/touchablehighlight">TouchableHighlight</a></li><li class="menu__list-item"><a class="menu__link" tabindex="0" href="/docs/touchableopacity">TouchableOpacity</a></li><li class="menu__list-item"><a class="menu__link" tabindex="0" href="/docs/touchablewithoutfeedback">TouchableWithoutFeedback</a></li><li class="menu__list-item"><a class="menu__link" tabindex="0" href="/docs/view">View</a></li><li class="menu__list-item"><a class="menu__link" tabindex="0" href="/docs/virtualizedlist">VirtualizedList</a></li><li class="menu__list-item"><a class="menu__link menu__link--sublist" href="#!" tabindex="0">Android Components</a><ul class="menu__list"><li class="menu__list-item"><a class="menu__link" tabindex="0" href="/docs/drawerlayoutandroid">DrawerLayoutAndroid</a></li><li class="menu__list-item"><a class="menu__link" tabindex="0" href="/docs/touchablenativefeedback">TouchableNativeFeedback</a></li></ul></li><li class="menu__list-item"><a class="menu__link menu__link--sublist" href="#!" tabindex="0">iOS Components</a><ul class="menu__list"><li class="menu__list-item"><a class="menu__link" tabindex="0" href="/docs/inputaccessoryview">InputAccessoryView</a></li><li class="menu__list-item"><a class="menu__link" tabindex="0" href="/docs/maskedviewios">🚧 MaskedViewIOS</a></li><li class="menu__list-item"><a class="menu__link" tabindex="0" href="/docs/safeareaview">SafeAreaView</a></li></ul></li></ul></li><li class="menu__list-item menu__list-item--collapsed"><a class="menu__link menu__link--sublist" href="#!">Props</a><ul class="menu__list"><li class="menu__list-item"><a class="menu__link" tabindex="-1" href="/docs/image-style-props">Image Style Props</a></li><li class="menu__list-item"><a class="menu__link" tabindex="-1" href="/docs/layout-props">Layout Props</a></li><li class="menu__list-item"><a class="menu__link" tabindex="-1" href="/docs/shadow-props">Shadow Props</a></li><li class="menu__list-item"><a class="menu__link" tabindex="-1" href="/docs/text-style-props">Text Style Props</a></li><li class="menu__list-item"><a class="menu__link" tabindex="-1" href="/docs/view-style-props">View Style Props</a></li></ul></li><li class="menu__list-item menu__list-item--collapsed"><a class="menu__link menu__link--sublist" href="#!">Object Types</a><ul class="menu__list"><li class="menu__list-item"><a class="menu__link" tabindex="-1" href="/docs/pressevent">PressEvent Object Type</a></li><li class="menu__list-item"><a class="menu__link" tabindex="-1" href="/docs/react-node">React Node Object Type</a></li><li class="menu__list-item"><a class="menu__link" tabindex="-1" href="/docs/rect">Rect Object Type</a></li></ul></li></ul></div></div></div><main class="docMainContainer_1rYT"><div class="container padding-vert--lg docItemWrapper_1Hme"><div class="row"><div class="col docItemCol_2AGf"><div class="docItemContainer_1tAC"><article><header><h1 class="docTitle_cWlf">TextInput</h1></header><div class="markdown"><p>A foundational component for inputting text into the app via a keyboard. Props provide configurability for several features, such as auto-correction, auto-capitalization, placeholder text, and different keyboard types, such as a numeric keypad.</p><p>The most basic use case is to plop down a <code>TextInput</code> and subscribe to the <code>onChangeText</code> events to read the user input. There are also other events, such as <code>onSubmitEditing</code> and <code>onFocus</code> that can be subscribed to. A minimal example:</p><div class="snack-player" data-snack-name="TextInput" data-snack-description="Example usage" data-snack-code="import%20React%20from%20'react'%3B%0Aimport%20%7B%20TextInput%20%7D%20from%20'react-native'%3B%0A%0Aconst%20UselessTextInput%20%3D%20()%20%3D%3E%20%7B%0A%20%20const%20%5Bvalue%2C%20onChangeText%5D%20%3D%20React.useState('Useless%20Placeholder')%3B%0A%0A%20%20return%20(%0A%20%20%20%20%3CTextInput%0A%20%20%20%20%20%20style%3D%7B%7B%20height%3A%2040%2C%20borderColor%3A%20'gray'%2C%20borderWidth%3A%201%20%7D%7D%0A%20%20%20%20%20%20onChangeText%3D%7Btext%20%3D%3E%20onChangeText(text)%7D%0A%20%20%20%20%20%20value%3D%7Bvalue%7D%0A%20%20%20%20%2F%3E%0A%20%20)%3B%0A%7D%0A%0Aexport%20default%20UselessTextInput%3B" data-snack-dependencies="" data-snack-platform="web" data-snack-supported-platforms="ios,android,web" data-snack-theme="light" data-snack-preview="true" data-snack-loading="lazy"></div><p>Two methods exposed via the native element are .focus() and .blur() that will focus or blur the TextInput programmatically.</p><p>Note that some props are only available with <code>multiline={true/false}</code>. Additionally, border styles that apply to only one side of the element (e.g., <code>borderBottomColor</code>, <code>borderLeftWidth</code>, etc.) will not be applied if <code>multiline=true</code>. To achieve the same effect, you can wrap your <code>TextInput</code> in a <code>View</code>:</p><div class="snack-player" data-snack-name="TextInput" data-snack-description="Example usage" data-snack-code="import%20React%20from%20'react'%3B%0Aimport%20%7B%20View%2C%20TextInput%20%7D%20from%20'react-native'%3B%0A%0Aconst%20UselessTextInput%20%3D%20(props)%20%3D%3E%20%7B%0A%20%20return%20(%0A%20%20%20%20%3CTextInput%0A%20%20%20%20%20%20%7B...props%7D%20%2F%2F%20Inherit%20any%20props%20passed%20to%20it%3B%20e.g.%2C%20multiline%2C%20numberOfLines%20below%0A%20%20%20%20%20%20editable%0A%20%20%20%20%20%20maxLength%3D%7B40%7D%0A%20%20%20%20%2F%3E%0A%20%20)%3B%0A%7D%0A%0Aconst%20UselessTextInputMultiline%20%3D%20()%20%3D%3E%20%7B%0A%20%20const%20%5Bvalue%2C%20onChangeText%5D%20%3D%20React.useState('Useless%20Multiline%20Placeholder')%3B%0A%0A%20%20%2F%2F%20If%20you%20type%20something%20in%20the%20text%20box%20that%20is%20a%20color%2C%20the%20background%20will%20change%20to%20that%0A%20%20%2F%2F%20color.%0A%20%20return%20(%0A%20%20%20%20%3CView%0A%20%20%20%20%20%20style%3D%7B%7B%0A%20%20%20%20%20%20%20%20backgroundColor%3A%20value%2C%0A%20%20%20%20%20%20%20%20borderBottomColor%3A%20'%23000000'%2C%0A%20%20%20%20%20%20%20%20borderBottomWidth%3A%201%2C%0A%20%20%20%20%20%20%7D%7D%3E%0A%20%20%20%20%20%20%3CUselessTextInput%0A%20%20%20%20%20%20%20%20multiline%0A%20%20%20%20%20%20%20%20numberOfLines%3D%7B4%7D%0A%20%20%20%20%20%20%20%20onChangeText%3D%7Btext%20%3D%3E%20onChangeText(text)%7D%0A%20%20%20%20%20%20%20%20value%3D%7Bvalue%7D%0A%20%20%20%20%20%20%2F%3E%0A%20%20%20%20%3C%2FView%3E%0A%20%20)%3B%0A%7D%0A%0Aexport%20default%20UselessTextInputMultiline%3B" data-snack-dependencies="" data-snack-platform="web" data-snack-supported-platforms="ios,android,web" data-snack-theme="light" data-snack-preview="true" data-snack-loading="lazy"></div><p><code>TextInput</code> has by default a border at the bottom of its view. This border has its padding set by the background image provided by the system, and it cannot be changed. Solutions to avoid this are to either not set height explicitly, in which case the system will take care of displaying the border in the correct position, or to not display the border by setting <code>underlineColorAndroid</code> to transparent.</p><p>Note that on Android performing text selection in an input can change the app's activity <code>windowSoftInputMode</code> param to <code>adjustResize</code>. This may cause issues with components that have position: 'absolute' while the keyboard is active. To avoid this behavior either specify <code>windowSoftInputMode</code> in AndroidManifest.xml ( <a href="https://developer.android.com/guide/topics/manifest/activity-element.html" target="_blank" rel="noopener noreferrer">https://developer.android.com/guide/topics/manifest/activity-element.html</a> ) or control this param programmatically with native code.</p><hr><h1><a aria-hidden="true" tabindex="-1" class="anchor enhancedAnchor_3pqN" id="reference"></a>Reference<a aria-hidden="true" tabindex="-1" class="hash-link" href="#reference" title="Direct link to heading">#</a></h1><h2><a aria-hidden="true" tabindex="-1" class="anchor enhancedAnchor_3pqN" id="props"></a>Props<a aria-hidden="true" tabindex="-1" class="hash-link" href="#props" title="Direct link to heading">#</a></h2><p>Inherits <a href="/docs/view#props">View Props</a>.</p><h3><a aria-hidden="true" tabindex="-1" class="anchor enhancedAnchor_3pqN" id="allowfontscaling"></a><code>allowFontScaling</code><a aria-hidden="true" tabindex="-1" class="hash-link" href="#allowfontscaling" title="Direct link to heading">#</a></h3><p>Specifies whether fonts should scale to respect Text Size accessibility settings. The default is <code>true</code>.</p><table><thead><tr><th>Type</th><th>Required</th></tr></thead><tbody><tr><td>bool</td><td>No</td></tr></tbody></table><hr><h3><a aria-hidden="true" tabindex="-1" class="anchor enhancedAnchor_3pqN" id="autocapitalize"></a><code>autoCapitalize</code><a aria-hidden="true" tabindex="-1" class="hash-link" href="#autocapitalize" title="Direct link to heading">#</a></h3><p>Can tell <code>TextInput</code> to automatically capitalize certain characters. This property is not supported by some keyboard types such as <code>name-phone-pad</code>.</p><ul><li><code>characters</code>: all characters.</li><li><code>words</code>: first letter of each word.</li><li><code>sentences</code>: first letter of each sentence (<em>default</em>).</li><li><code>none</code>: don't auto capitalize anything.</li></ul><table><thead><tr><th>Type</th><th>Required</th></tr></thead><tbody><tr><td>enum('none', 'sentences', 'words', 'characters')</td><td>No</td></tr></tbody></table><hr><h3><a aria-hidden="true" tabindex="-1" class="anchor enhancedAnchor_3pqN" id="autocompletetype"></a><code>autoCompleteType</code><a aria-hidden="true" tabindex="-1" class="hash-link" href="#autocompletetype" title="Direct link to heading">#</a></h3><p>Specifies autocomplete hints for the system, so it can provide autofill. On Android, the system will always attempt to offer autofill by using heuristics to identify the type of content. To disable autocomplete, set <code>autoCompleteType</code> to <code>off</code>.</p><p>Possible values for <code>autoCompleteType</code> are:</p><ul><li><code>off</code></li><li><code>username</code></li><li><code>password</code></li><li><code>email</code></li><li><code>name</code></li><li><code>tel</code></li><li><code>street-address</code></li><li><code>postal-code</code></li><li><code>cc-number</code></li><li><code>cc-csc</code></li><li><code>cc-exp</code></li><li><code>cc-exp-month</code></li><li><code>cc-exp-year</code></li></ul><table><thead><tr><th>Type</th><th>Required</th><th>Platform</th></tr></thead><tbody><tr><td>enum('off', 'username', 'password', 'email', 'name', 'tel', 'street-address', 'postal-code', 'cc-number', 'cc-csc', 'cc-exp', 'cc-exp-month', 'cc-exp-year')</td><td>No</td><td>Android</td></tr></tbody></table><hr><h3><a aria-hidden="true" tabindex="-1" class="anchor enhancedAnchor_3pqN" id="autocorrect"></a><code>autoCorrect</code><a aria-hidden="true" tabindex="-1" class="hash-link" href="#autocorrect" title="Direct link to heading">#</a></h3><p>If <code>false</code>, disables auto-correct. The default value is <code>true</code>.</p><table><thead><tr><th>Type</th><th>Required</th></tr></thead><tbody><tr><td>bool</td><td>No</td></tr></tbody></table><hr><h3><a aria-hidden="true" tabindex="-1" class="anchor enhancedAnchor_3pqN" id="autofocus"></a><code>autoFocus</code><a aria-hidden="true" tabindex="-1" class="hash-link" href="#autofocus" title="Direct link to heading">#</a></h3><p>If <code>true</code>, focuses the input on <code>componentDidMount</code>. The default value is <code>false</code>.</p><table><thead><tr><th>Type</th><th>Required</th></tr></thead><tbody><tr><td>bool</td><td>No</td></tr></tbody></table><hr><h3><a aria-hidden="true" tabindex="-1" class="anchor enhancedAnchor_3pqN" id="bluronsubmit"></a><code>blurOnSubmit</code><a aria-hidden="true" tabindex="-1" class="hash-link" href="#bluronsubmit" title="Direct link to heading">#</a></h3><p>If <code>true</code>, the text field will blur when submitted. The default value is true for single-line fields and false for multiline fields. Note that for multiline fields, setting <code>blurOnSubmit</code> to <code>true</code> means that pressing return will blur the field and trigger the <code>onSubmitEditing</code> event instead of inserting a newline into the field.</p><table><thead><tr><th>Type</th><th>Required</th></tr></thead><tbody><tr><td>bool</td><td>No</td></tr></tbody></table><hr><h3><a aria-hidden="true" tabindex="-1" class="anchor enhancedAnchor_3pqN" id="carethidden"></a><code>caretHidden</code><a aria-hidden="true" tabindex="-1" class="hash-link" href="#carethidden" title="Direct link to heading">#</a></h3><p>If <code>true</code>, caret is hidden. The default value is <code>false</code>.</p><table><thead><tr><th>Type</th><th>Required</th></tr></thead><tbody><tr><td>bool</td><td>No</td></tr></tbody></table><hr><h3><a aria-hidden="true" tabindex="-1" class="anchor enhancedAnchor_3pqN" id="clearbuttonmode"></a><code>clearButtonMode</code><a aria-hidden="true" tabindex="-1" class="hash-link" href="#clearbuttonmode" title="Direct link to heading">#</a></h3><p>When the clear button should appear on the right side of the text view. This property is supported only for single-line TextInput component. The default value is <code>never</code>.</p><table><thead><tr><th>Type</th><th>Required</th><th>Platform</th></tr></thead><tbody><tr><td>enum('never', 'while-editing', 'unless-editing', 'always')</td><td>No</td><td>iOS</td></tr></tbody></table><hr><h3><a aria-hidden="true" tabindex="-1" class="anchor enhancedAnchor_3pqN" id="cleartextonfocus"></a><code>clearTextOnFocus</code><a aria-hidden="true" tabindex="-1" class="hash-link" href="#cleartextonfocus" title="Direct link to heading">#</a></h3><p>If <code>true</code>, clears the text field automatically when editing begins.</p><table><thead><tr><th>Type</th><th>Required</th><th>Platform</th></tr></thead><tbody><tr><td>bool</td><td>No</td><td>iOS</td></tr></tbody></table><hr><h3><a aria-hidden="true" tabindex="-1" class="anchor enhancedAnchor_3pqN" id="contextmenuhidden"></a><code>contextMenuHidden</code><a aria-hidden="true" tabindex="-1" class="hash-link" href="#contextmenuhidden" title="Direct link to heading">#</a></h3><p>If <code>true</code>, context menu is hidden. The default value is <code>false</code>.</p><table><thead><tr><th>Type</th><th>Required</th></tr></thead><tbody><tr><td>bool</td><td>No</td></tr></tbody></table><hr><h3><a aria-hidden="true" tabindex="-1" class="anchor enhancedAnchor_3pqN" id="datadetectortypes"></a><code>dataDetectorTypes</code><a aria-hidden="true" tabindex="-1" class="hash-link" href="#datadetectortypes" title="Direct link to heading">#</a></h3><p>Determines the types of data converted to clickable URLs in the text input. Only valid if <code>multiline={true}</code> and <code>editable={false}</code>. By default no data types are detected.</p><p>You can provide one type or an array of many types.</p><p>Possible values for <code>dataDetectorTypes</code> are:</p><ul><li><code>'phoneNumber'</code></li><li><code>'link'</code></li><li><code>'address'</code></li><li><code>'calendarEvent'</code></li><li><code>'none'</code></li><li><code>'all'</code></li></ul><table><thead><tr><th>Type</th><th>Required</th><th>Platform</th></tr></thead><tbody><tr><td>enum('phoneNumber', 'link', 'address', 'calendarEvent', 'none', 'all'), ,array of enum('phoneNumber', 'link', 'address', 'calendarEvent', 'none', 'all')</td><td>No</td><td>iOS</td></tr></tbody></table><hr><h3><a aria-hidden="true" tabindex="-1" class="anchor enhancedAnchor_3pqN" id="defaultvalue"></a><code>defaultValue</code><a aria-hidden="true" tabindex="-1" class="hash-link" href="#defaultvalue" title="Direct link to heading">#</a></h3><p>Provides an initial value that will change when the user starts typing. Useful for use-cases where you do not want to deal with listening to events and updating the value prop to keep the controlled state in sync.</p><table><thead><tr><th>Type</th><th>Required</th></tr></thead><tbody><tr><td>string</td><td>No</td></tr></tbody></table><hr><h3><a aria-hidden="true" tabindex="-1" class="anchor enhancedAnchor_3pqN" id="disablefullscreenui"></a><code>disableFullscreenUI</code><a aria-hidden="true" tabindex="-1" class="hash-link" href="#disablefullscreenui" title="Direct link to heading">#</a></h3><p>When <code>false</code>, if there is a small amount of space available around a text input (e.g. landscape orientation on a phone), the OS may choose to have the user edit the text inside of a full screen text input mode. When <code>true</code>, this feature is disabled and users will always edit the text directly inside of the text input. Defaults to <code>false</code>.</p><table><thead><tr><th>Type</th><th>Required</th><th>Platform</th></tr></thead><tbody><tr><td>bool</td><td>No</td><td>Android</td></tr></tbody></table><hr><h3><a aria-hidden="true" tabindex="-1" class="anchor enhancedAnchor_3pqN" id="editable"></a><code>editable</code><a aria-hidden="true" tabindex="-1" class="hash-link" href="#editable" title="Direct link to heading">#</a></h3><p>If <code>false</code>, text is not editable. The default value is <code>true</code>.</p><table><thead><tr><th>Type</th><th>Required</th></tr></thead><tbody><tr><td>bool</td><td>No</td></tr></tbody></table><hr><h3><a aria-hidden="true" tabindex="-1" class="anchor enhancedAnchor_3pqN" id="enablesreturnkeyautomatically"></a><code>enablesReturnKeyAutomatically</code><a aria-hidden="true" tabindex="-1" class="hash-link" href="#enablesreturnkeyautomatically" title="Direct link to heading">#</a></h3><p>If <code>true</code>, the keyboard disables the return key when there is no text and automatically enables it when there is text. The default value is <code>false</code>.</p><table><thead><tr><th>Type</th><th>Required</th><th>Platform</th></tr></thead><tbody><tr><td>bool</td><td>No</td><td>iOS</td></tr></tbody></table><hr><h3><a aria-hidden="true" tabindex="-1" class="anchor enhancedAnchor_3pqN" id="importantforautofill"></a><code>importantForAutofill</code><a aria-hidden="true" tabindex="-1" class="hash-link" href="#importantforautofill" title="Direct link to heading">#</a></h3><p>Tells the operating system whether the individual fields in your app should be included in a view structure for autofill purposes on Android API Level 26+. Possible values are <code>auto</code>, <code>no</code>, <code>noExcludeDescendants</code>, <code>yes</code>, and <code>yesExcludeDescendants</code>. The default value is <code>auto</code>.</p><ul><li><code>auto</code>: Let the Android System use its heuristics to determine if the view is important for autofill.</li><li><code>no</code>: This view isn't important for autofill.</li><li><code>noExcludeDescendants</code>: This view and its children aren't important for autofill.</li><li><code>yes</code>: This view is important for autofill.</li><li><code>yesExcludeDescendants</code>: This view is important for autofill, but its children aren't important for autofill.</li></ul><table><thead><tr><th>Type</th><th>Required</th><th>Platform</th></tr></thead><tbody><tr><td>enum('auto', 'no', 'noExcludeDescendants', 'yes', 'yesExcludeDescendants')</td><td>No</td><td>Android</td></tr></tbody></table><hr><h3><a aria-hidden="true" tabindex="-1" class="anchor enhancedAnchor_3pqN" id="inlineimageleft"></a><code>inlineImageLeft</code><a aria-hidden="true" tabindex="-1" class="hash-link" href="#inlineimageleft" title="Direct link to heading">#</a></h3><p>If defined, the provided image resource will be rendered on the left. The image resource must be inside <code>/android/app/src/main/res/drawable</code> and referenced like</p><div class="mdxCodeBlock_xYIz"><div class="codeBlockContent_rlEb"><button tabindex="0" type="button" aria-label="Copy code to clipboard" class="copyButton_kOW4">Copy</button><div class="prism-code language-jsx codeBlock_1AP7"><div class="codeBlockLines_1boI" style="color:#FFFFFF;background:#282C34"><div class="token-line" style="color:#FFFFFF;background:#282C34"><span class="token tag punctuation" style="color:#657b83"><</span><span class="token tag class-name" style="color:#fac863">TextInput</span><span class="token tag" style="color:#fc929e"></span></div><div class="token-line" style="color:#FFFFFF;background:#282C34"><span class="token tag" style="color:#fc929e"> </span><span class="token tag attr-name" style="color:#c5a5c5">inlineImageLeft</span><span class="token tag attr-value punctuation" style="color:#657b83">=</span><span class="token tag attr-value punctuation" style="color:#657b83">'</span><span class="token tag attr-value" style="color:#8dc891">search_icon</span><span class="token tag attr-value punctuation" style="color:#657b83">'</span><span class="token tag" style="color:#fc929e"></span></div><div class="token-line" style="color:#FFFFFF;background:#282C34"><span class="token tag" style="color:#fc929e"></span><span class="token tag punctuation" style="color:#657b83">/></span></div></div></div></div></div><table><thead><tr><th>Type</th><th>Required</th><th>Platform</th></tr></thead><tbody><tr><td>string</td><td>No</td><td>Android</td></tr></tbody></table><hr><h3><a aria-hidden="true" tabindex="-1" class="anchor enhancedAnchor_3pqN" id="inlineimagepadding"></a><code>inlineImagePadding</code><a aria-hidden="true" tabindex="-1" class="hash-link" href="#inlineimagepadding" title="Direct link to heading">#</a></h3><p>Padding between the inline image, if any, and the text input itself.</p><table><thead><tr><th>Type</th><th>Required</th><th>Platform</th></tr></thead><tbody><tr><td>number</td><td>No</td><td>Android</td></tr></tbody></table><hr><h3><a aria-hidden="true" tabindex="-1" class="anchor enhancedAnchor_3pqN" id="inputaccessoryviewid"></a><code>inputAccessoryViewID</code><a aria-hidden="true" tabindex="-1" class="hash-link" href="#inputaccessoryviewid" title="Direct link to heading">#</a></h3><p>An optional identifier which links a custom <a href="/docs/inputaccessoryview">InputAccessoryView</a> to this text input. The InputAccessoryView is rendered above the keyboard when this text input is focused.</p><table><thead><tr><th>Type</th><th>Required</th><th>Platform</th></tr></thead><tbody><tr><td>string</td><td>No</td><td>iOS</td></tr></tbody></table><hr><h3><a aria-hidden="true" tabindex="-1" class="anchor enhancedAnchor_3pqN" id="keyboardappearance"></a><code>keyboardAppearance</code><a aria-hidden="true" tabindex="-1" class="hash-link" href="#keyboardappearance" title="Direct link to heading">#</a></h3><p>Determines the color of the keyboard.</p><table><thead><tr><th>Type</th><th>Required</th><th>Platform</th></tr></thead><tbody><tr><td>enum('default', 'light', 'dark')</td><td>No</td><td>iOS</td></tr></tbody></table><hr><h3><a aria-hidden="true" tabindex="-1" class="anchor enhancedAnchor_3pqN" id="keyboardtype"></a><code>keyboardType</code><a aria-hidden="true" tabindex="-1" class="hash-link" href="#keyboardtype" title="Direct link to heading">#</a></h3><p>Determines which keyboard to open, e.g.<code>numeric</code>.</p><p>See screenshots of all the types <a href="http://lefkowitz.me/2018/04/30/visual-guide-to-react-native-textinput-keyboardtype-options/" target="_blank" rel="noopener noreferrer">here</a>.</p><p>The following values work across platforms:</p><ul><li><code>default</code></li><li><code>number-pad</code></li><li><code>decimal-pad</code></li><li><code>numeric</code></li><li><code>email-address</code></li><li><code>phone-pad</code></li></ul><p><em>iOS Only</em></p><p>The following values work on iOS only:</p><ul><li><code>ascii-capable</code></li><li><code>numbers-and-punctuation</code></li><li><code>url</code></li><li><code>name-phone-pad</code></li><li><code>twitter</code></li><li><code>web-search</code></li></ul><p><em>Android Only</em></p><p>The following values work on Android only:</p><ul><li><code>visible-password</code></li></ul><table><thead><tr><th>Type</th><th>Required</th></tr></thead><tbody><tr><td>enum('default', 'email-address', 'numeric', 'phone-pad', 'ascii-capable', 'numbers-and-punctuation', 'url', 'number-pad', 'name-phone-pad', 'decimal-pad', 'twitter', 'web-search', 'visible-password')</td><td>No</td></tr></tbody></table><hr><h3><a aria-hidden="true" tabindex="-1" class="anchor enhancedAnchor_3pqN" id="maxfontsizemultiplier"></a><code>maxFontSizeMultiplier</code><a aria-hidden="true" tabindex="-1" class="hash-link" href="#maxfontsizemultiplier" title="Direct link to heading">#</a></h3><p>Specifies largest possible scale a font can reach when <code>allowFontScaling</code> is enabled. Possible values:</p><ul><li><code>null/undefined</code> (default): inherit from the parent node or the global default (0)</li><li><code>0</code>: no max, ignore parent/global default</li><li><code>>= 1</code>: sets the <code>maxFontSizeMultiplier</code> of this node to this value</li></ul><table><thead><tr><th>Type</th><th>Required</th></tr></thead><tbody><tr><td>number</td><td>No</td></tr></tbody></table><hr><h3><a aria-hidden="true" tabindex="-1" class="anchor enhancedAnchor_3pqN" id="maxlength"></a><code>maxLength</code><a aria-hidden="true" tabindex="-1" class="hash-link" href="#maxlength" title="Direct link to heading">#</a></h3><p>Limits the maximum number of characters that can be entered. Use this instead of implementing the logic in JS to avoid flicker.</p><table><thead><tr><th>Type</th><th>Required</th></tr></thead><tbody><tr><td>number</td><td>No</td></tr></tbody></table><hr><h3><a aria-hidden="true" tabindex="-1" class="anchor enhancedAnchor_3pqN" id="multiline"></a><code>multiline</code><a aria-hidden="true" tabindex="-1" class="hash-link" href="#multiline" title="Direct link to heading">#</a></h3><p>If <code>true</code>, the text input can be multiple lines. The default value is <code>false</code>. It is important to note that this aligns the text to the top on iOS, and centers it on Android. Use with <code>textAlignVertical</code> set to <code>top</code> for the same behavior in both platforms.</p><table><thead><tr><th>Type</th><th>Required</th></tr></thead><tbody><tr><td>bool</td><td>No</td></tr></tbody></table><hr><h3><a aria-hidden="true" tabindex="-1" class="anchor enhancedAnchor_3pqN" id="numberoflines"></a><code>numberOfLines</code><a aria-hidden="true" tabindex="-1" class="hash-link" href="#numberoflines" title="Direct link to heading">#</a></h3><p>Sets the number of lines for a <code>TextInput</code>. Use it with multiline set to <code>true</code> to be able to fill the lines.</p><table><thead><tr><th>Type</th><th>Required</th><th>Platform</th></tr></thead><tbody><tr><td>number</td><td>No</td><td>Android</td></tr></tbody></table><hr><h3><a aria-hidden="true" tabindex="-1" class="anchor enhancedAnchor_3pqN" id="onblur"></a><code>onBlur</code><a aria-hidden="true" tabindex="-1" class="hash-link" href="#onblur" title="Direct link to heading">#</a></h3><p>Callback that is called when the text input is blurred.</p><table><thead><tr><th>Type</th><th>Required</th></tr></thead><tbody><tr><td>function</td><td>No</td></tr></tbody></table><hr><h3><a aria-hidden="true" tabindex="-1" class="anchor enhancedAnchor_3pqN" id="onchange"></a><code>onChange</code><a aria-hidden="true" tabindex="-1" class="hash-link" href="#onchange" title="Direct link to heading">#</a></h3><p>Callback that is called when the text input's text changes. This will be called with <code>{ nativeEvent: { eventCount, target, text} }</code></p><table><thead><tr><th>Type</th><th>Required</th></tr></thead><tbody><tr><td>function</td><td>No</td></tr></tbody></table><hr><h3><a aria-hidden="true" tabindex="-1" class="anchor enhancedAnchor_3pqN" id="onchangetext"></a><code>onChangeText</code><a aria-hidden="true" tabindex="-1" class="hash-link" href="#onchangetext" title="Direct link to heading">#</a></h3><p>Callback that is called when the text input's text changes. Changed text is passed as a single string argument to the callback handler.</p><table><thead><tr><th>Type</th><th>Required</th></tr></thead><tbody><tr><td>function</td><td>No</td></tr></tbody></table><hr><h3><a aria-hidden="true" tabindex="-1" class="anchor enhancedAnchor_3pqN" id="oncontentsizechange"></a><code>onContentSizeChange</code><a aria-hidden="true" tabindex="-1" class="hash-link" href="#oncontentsizechange" title="Direct link to heading">#</a></h3><p>Callback that is called when the text input's content size changes. This will be called with <code>{ nativeEvent: { contentSize: { width, height } } }</code>.</p><p>Only called for multiline text inputs.</p><table><thead><tr><th>Type</th><th>Required</th></tr></thead><tbody><tr><td>function</td><td>No</td></tr></tbody></table><hr><h3><a aria-hidden="true" tabindex="-1" class="anchor enhancedAnchor_3pqN" id="onendediting"></a><code>onEndEditing</code><a aria-hidden="true" tabindex="-1" class="hash-link" href="#onendediting" title="Direct link to heading">#</a></h3><p>Callback that is called when text input ends.</p><table><thead><tr><th>Type</th><th>Required</th></tr></thead><tbody><tr><td>function</td><td>No</td></tr></tbody></table><hr><h3><a aria-hidden="true" tabindex="-1" class="anchor enhancedAnchor_3pqN" id="onfocus"></a><code>onFocus</code><a aria-hidden="true" tabindex="-1" class="hash-link" href="#onfocus" title="Direct link to heading">#</a></h3><p>Callback that is called when the text input is focused. This is called with <code>{ nativeEvent: { target } }</code>.</p><table><thead><tr><th>Type</th><th>Required</th></tr></thead><tbody><tr><td>function</td><td>No</td></tr></tbody></table><hr><h3><a aria-hidden="true" tabindex="-1" class="anchor enhancedAnchor_3pqN" id="onkeypress"></a><code>onKeyPress</code><a aria-hidden="true" tabindex="-1" class="hash-link" href="#onkeypress" title="Direct link to heading">#</a></h3><p>Callback that is called when a key is pressed. This will be called with <code>{ nativeEvent: { key: keyValue } }</code> where <code>keyValue</code> is <code>'Enter'</code> or <code>'Backspace'</code> for respective keys and the typed-in character otherwise including <code>' '</code> for space. Fires before <code>onChange</code> callbacks. Note: on Android only the inputs from soft keyboard are handled, not the hardware keyboard inputs.</p><table><thead><tr><th>Type</th><th>Required</th></tr></thead><tbody><tr><td>function</td><td>No</td></tr></tbody></table><hr><h3><a aria-hidden="true" tabindex="-1" class="anchor enhancedAnchor_3pqN" id="onlayout"></a><code>onLayout</code><a aria-hidden="true" tabindex="-1" class="hash-link" href="#onlayout" title="Direct link to heading">#</a></h3><p>Invoked on mount and layout changes with <code>{ nativeEvent: {layout: {x, y, width, height}, target } }</code>.</p><table><thead><tr><th>Type</th><th>Required</th></tr></thead><tbody><tr><td>function</td><td>No</td></tr></tbody></table><hr><h3><a aria-hidden="true" tabindex="-1" class="anchor enhancedAnchor_3pqN" id="onscroll"></a><code>onScroll</code><a aria-hidden="true" tabindex="-1" class="hash-link" href="#onscroll" title="Direct link to heading">#</a></h3><p>Invoked on content scroll with <code>{ nativeEvent: { contentOffset: { x, y } } }</code>. May also contain other properties from ScrollEvent but on Android contentSize is not provided for performance reasons.</p><table><thead><tr><th>Type</th><th>Required</th></tr></thead><tbody><tr><td>function</td><td>No</td></tr></tbody></table><hr><h3><a aria-hidden="true" tabindex="-1" class="anchor enhancedAnchor_3pqN" id="onselectionchange"></a><code>onSelectionChange</code><a aria-hidden="true" tabindex="-1" class="hash-link" href="#onselectionchange" title="Direct link to heading">#</a></h3><p>Callback that is called when the text input selection is changed. This will be called with <code>{ nativeEvent: { selection: { start, end } } }</code>. This prop requires <code>multiline={true}</code> to be set.</p><table><thead><tr><th>Type</th><th>Required</th></tr></thead><tbody><tr><td>function</td><td>No</td></tr></tbody></table><hr><h3><a aria-hidden="true" tabindex="-1" class="anchor enhancedAnchor_3pqN" id="onsubmitediting"></a><code>onSubmitEditing</code><a aria-hidden="true" tabindex="-1" class="hash-link" href="#onsubmitediting" title="Direct link to heading">#</a></h3><p>Callback that is called when the text input's submit button is pressed with the argument <code>{nativeEvent: {text, eventCount, target}}</code>.</p><table><thead><tr><th>Type</th><th>Required</th></tr></thead><tbody><tr><td>function</td><td>No</td></tr></tbody></table><p>Note that on iOS this method isn't called when using <code>keyboardType="phone-pad"</code>.</p><hr><h3><a aria-hidden="true" tabindex="-1" class="anchor enhancedAnchor_3pqN" id="placeholder"></a><code>placeholder</code><a aria-hidden="true" tabindex="-1" class="hash-link" href="#placeholder" title="Direct link to heading">#</a></h3><p>The string that will be rendered before text input has been entered.</p><table><thead><tr><th>Type</th><th>Required</th></tr></thead><tbody><tr><td>string</td><td>No</td></tr></tbody></table><hr><h3><a aria-hidden="true" tabindex="-1" class="anchor enhancedAnchor_3pqN" id="placeholdertextcolor"></a><code>placeholderTextColor</code><a aria-hidden="true" tabindex="-1" class="hash-link" href="#placeholdertextcolor" title="Direct link to heading">#</a></h3><p>The text color of the placeholder string.</p><table><thead><tr><th>Type</th><th>Required</th></tr></thead><tbody><tr><td><a href="/docs/colors">color</a></td><td>No</td></tr></tbody></table><hr><h3><a aria-hidden="true" tabindex="-1" class="anchor enhancedAnchor_3pqN" id="returnkeylabel"></a><code>returnKeyLabel</code><a aria-hidden="true" tabindex="-1" class="hash-link" href="#returnkeylabel" title="Direct link to heading">#</a></h3><p>Sets the return key to the label. Use it instead of <code>returnKeyType</code>.</p><table><thead><tr><th>Type</th><th>Required</th><th>Platform</th></tr></thead><tbody><tr><td>string</td><td>No</td><td>Android</td></tr></tbody></table><hr><h3><a aria-hidden="true" tabindex="-1" class="anchor enhancedAnchor_3pqN" id="returnkeytype"></a><code>returnKeyType</code><a aria-hidden="true" tabindex="-1" class="hash-link" href="#returnkeytype" title="Direct link to heading">#</a></h3><p>Determines how the return key should look. On Android you can also use <code>returnKeyLabel</code>.</p><p><em>Cross platform</em></p><p>The following values work across platforms:</p><ul><li><code>done</code></li><li><code>go</code></li><li><code>next</code></li><li><code>search</code></li><li><code>send</code></li></ul><p><em>Android Only</em></p><p>The following values work on Android only:</p><ul><li><code>none</code></li><li><code>previous</code></li></ul><p><em>iOS Only</em></p><p>The following values work on iOS only:</p><ul><li><code>default</code></li><li><code>emergency-call</code></li><li><code>google</code></li><li><code>join</code></li><li><code>route</code></li><li><code>yahoo</code></li></ul><table><thead><tr><th>Type</th><th>Required</th></tr></thead><tbody><tr><td>enum('done', 'go', 'next', 'search', 'send', 'none', 'previous', 'default', 'emergency-call', 'google', 'join', 'route', 'yahoo')</td><td>No</td></tr></tbody></table><h3><a aria-hidden="true" tabindex="-1" class="anchor enhancedAnchor_3pqN" id="rejectrespondertermination"></a><code>rejectResponderTermination</code><a aria-hidden="true" tabindex="-1" class="hash-link" href="#rejectrespondertermination" title="Direct link to heading">#</a></h3><p><em>iOS Only</em></p><p>If <code>true</code>, allows TextInput to pass touch events to the parent component. This allows components such as SwipeableListView to be swipeable from the TextInput on iOS, as is the case on Android by default. If <code>false</code>, TextInput always asks to handle the input (except when disabled). The default value is <code>true</code>.</p><table><thead><tr><th>Type</th><th>Required</th><th>Platform</th></tr></thead><tbody><tr><td>bool</td><td>No</td><td>iOS</td></tr></tbody></table><hr><h3><a aria-hidden="true" tabindex="-1" class="anchor enhancedAnchor_3pqN" id="scrollenabled"></a><code>scrollEnabled</code><a aria-hidden="true" tabindex="-1" class="hash-link" href="#scrollenabled" title="Direct link to heading">#</a></h3><p>If <code>false</code>, scrolling of the text view will be disabled. The default value is <code>true</code>. Only works with <code>multiline={true}</code>.</p><table><thead><tr><th>Type</th><th>Required</th><th>Platform</th></tr></thead><tbody><tr><td>bool</td><td>No</td><td>iOS</td></tr></tbody></table><hr><h3><a aria-hidden="true" tabindex="-1" class="anchor enhancedAnchor_3pqN" id="securetextentry"></a><code>secureTextEntry</code><a aria-hidden="true" tabindex="-1" class="hash-link" href="#securetextentry" title="Direct link to heading">#</a></h3><p>If <code>true</code>, the text input obscures the text entered so that sensitive text like passwords stay secure. The default value is <code>false</code>. Does not work with <code>multiline={true}</code>.</p><table><thead><tr><th>Type</th><th>Required</th></tr></thead><tbody><tr><td>bool</td><td>No</td></tr></tbody></table><hr><h3><a aria-hidden="true" tabindex="-1" class="anchor enhancedAnchor_3pqN" id="selection"></a><code>selection</code><a aria-hidden="true" tabindex="-1" class="hash-link" href="#selection" title="Direct link to heading">#</a></h3><p>The start and end of the text input's selection. Set start and end to the same value to position the cursor.</p><table><thead><tr><th>Type</th><th>Required</th></tr></thead><tbody><tr><td>object: {start: number,end: number}</td><td>No</td></tr></tbody></table><hr><h3><a aria-hidden="true" tabindex="-1" class="anchor enhancedAnchor_3pqN" id="selectioncolor"></a><code>selectionColor</code><a aria-hidden="true" tabindex="-1" class="hash-link" href="#selectioncolor" title="Direct link to heading">#</a></h3><p>The highlight and cursor color of the text input.</p><table><thead><tr><th>Type</th><th>Required</th></tr></thead><tbody><tr><td><a href="/docs/colors">color</a></td><td>No</td></tr></tbody></table><hr><h3><a aria-hidden="true" tabindex="-1" class="anchor enhancedAnchor_3pqN" id="selecttextonfocus"></a><code>selectTextOnFocus</code><a aria-hidden="true" tabindex="-1" class="hash-link" href="#selecttextonfocus" title="Direct link to heading">#</a></h3><p>If <code>true</code>, all text will automatically be selected on focus.</p><table><thead><tr><th>Type</th><th>Required</th></tr></thead><tbody><tr><td>bool</td><td>No</td></tr></tbody></table><hr><h3><a aria-hidden="true" tabindex="-1" class="anchor enhancedAnchor_3pqN" id="showsoftinputonfocus"></a><code>showSoftInputOnFocus</code><a aria-hidden="true" tabindex="-1" class="hash-link" href="#showsoftinputonfocus" title="Direct link to heading">#</a></h3><p>When <code>false</code>, it will prevent the soft keyboard from showing when the field is focused. The default value is <code>true</code>.</p><table><thead><tr><th>Type</th><th>Required</th><th>Platform</th></tr></thead><tbody><tr><td>bool</td><td>No</td><td>Android</td></tr></tbody></table><hr><h3><a aria-hidden="true" tabindex="-1" class="anchor enhancedAnchor_3pqN" id="spellcheck"></a><code>spellCheck</code><a aria-hidden="true" tabindex="-1" class="hash-link" href="#spellcheck" title="Direct link to heading">#</a></h3><p>If <code>false</code>, disables spell-check style (i.e. red underlines). The default value is inherited from <code>autoCorrect</code>.</p><table><thead><tr><th>Type</th><th>Required</th><th>Platform</th></tr></thead><tbody><tr><td>bool</td><td>No</td><td>iOS</td></tr></tbody></table><hr><h3><a aria-hidden="true" tabindex="-1" class="anchor enhancedAnchor_3pqN" id="textalign"></a><code>textAlign</code><a aria-hidden="true" tabindex="-1" class="hash-link" href="#textalign" title="Direct link to heading">#</a></h3><p>Align the input text to the left, center, or right sides of the input field.</p><p>Possible values for <code>textAlign</code> are:</p><ul><li><code>left</code></li><li><code>center</code></li><li><code>right</code></li></ul><table><thead><tr><th>Type</th><th>Required</th></tr></thead><tbody><tr><td>enum('left', 'center', 'right')</td><td>No</td></tr></tbody></table><hr><h3><a aria-hidden="true" tabindex="-1" class="anchor enhancedAnchor_3pqN" id="textcontenttype"></a><code>textContentType</code><a aria-hidden="true" tabindex="-1" class="hash-link" href="#textcontenttype" title="Direct link to heading">#</a></h3><p>Give the keyboard and the system information about the expected semantic meaning for the content that users enter.</p><p>For iOS 11+ you can set <code>textContentType</code> to <code>username</code> or <code>password</code> to enable autofill of login details from the device keychain.</p><p>For iOS 12+ <code>newPassword</code> can be used to indicate a new password input the user may want to save in the keychain, and <code>oneTimeCode</code> can be used to indicate that a field can be autofilled by a code arriving in an SMS.</p><p>To disable autofill, set <code>textContentType</code> to <code>none</code>.</p><p>Possible values for <code>textContentType</code> are:</p><ul><li><code>none</code></li><li><code>URL</code></li><li><code>addressCity</code></li><li><code>addressCityAndState</code></li><li><code>addressState</code></li><li><code>countryName</code></li><li><code>creditCardNumber</code></li><li><code>emailAddress</code></li><li><code>familyName</code></li><li><code>fullStreetAddress</code></li><li><code>givenName</code></li><li><code>jobTitle</code></li><li><code>location</code></li><li><code>middleName</code></li><li><code>name</code></li><li><code>namePrefix</code></li><li><code>nameSuffix</code></li><li><code>nickname</code></li><li><code>organizationName</code></li><li><code>postalCode</code></li><li><code>streetAddressLine1</code></li><li><code>streetAddressLine2</code></li><li><code>sublocality</code></li><li><code>telephoneNumber</code></li><li><code>username</code></li><li><code>password</code></li><li><code>newPassword</code></li><li><code>oneTimeCode</code></li></ul><table><thead><tr><th>Type</th><th>Required</th><th>Platform</th></tr></thead><tbody><tr><td>enum('none', 'URL', 'addressCity', 'addressCityAndState', 'addressState', 'countryName', 'creditCardNumber', 'emailAddress', 'familyName', 'fullStreetAddress', 'givenName', 'jobTitle', 'location', 'middleName', 'name', 'namePrefix', 'nameSuffix', 'nickname', 'organizationName', 'postalCode', 'streetAddressLine1', 'streetAddressLine2', 'sublocality', 'telephoneNumber', 'username', 'password')</td><td>No</td><td>iOS</td></tr></tbody></table><hr><h3><a aria-hidden="true" tabindex="-1" class="anchor enhancedAnchor_3pqN" id="passwordrules"></a><code>passwordRules</code><a aria-hidden="true" tabindex="-1" class="hash-link" href="#passwordrules" title="Direct link to heading">#</a></h3><p>When using <code>textContentType</code> as <code>newPassword</code> on iOS we can let the OS know the minimum requirements of the password so that it can generate one that will satisfy them. In order to create a valid string for <code>PasswordRules</code> take a look to the <a href="https://developer.apple.com/password-rules/" target="_blank" rel="noopener noreferrer">Apple Docs</a>.</p><table><thead><tr><th>Type</th><th>Required</th><th>Platform</th></tr></thead><tbody><tr><td>string</td><td>No</td><td>iOS</td></tr></tbody></table><hr><h3><a aria-hidden="true" tabindex="-1" class="anchor enhancedAnchor_3pqN" id="style"></a><code>style</code><a aria-hidden="true" tabindex="-1" class="hash-link" href="#style" title="Direct link to heading">#</a></h3><p>Note that not all Text styles are supported, an incomplete list of what is not supported includes:</p><ul><li><code>borderLeftWidth</code></li><li><code>borderTopWidth</code></li><li><code>borderRightWidth</code></li><li><code>borderBottomWidth</code></li><li><code>borderTopLeftRadius</code></li><li><code>borderTopRightRadius</code></li><li><code>borderBottomRightRadius</code></li><li><code>borderBottomLeftRadius</code></li></ul><p>see <a href="https://github.com/facebook/react-native/issues/7070" target="_blank" rel="noopener noreferrer">Issue#7070</a> for more detail.</p><p><a href="/docs/style">Styles</a></p><table><thead><tr><th>Type</th><th>Required</th></tr></thead><tbody><tr><td><a href="/docs/text#style">Text</a></td><td>No</td></tr></tbody></table><hr><h3><a aria-hidden="true" tabindex="-1" class="anchor enhancedAnchor_3pqN" id="textbreakstrategy"></a><code>textBreakStrategy</code><a aria-hidden="true" tabindex="-1" class="hash-link" href="#textbreakstrategy" title="Direct link to heading">#</a></h3><p>Set text break strategy on Android API Level 23+, possible values are <code>simple</code>, <code>highQuality</code>, <code>balanced</code> The default value is <code>simple</code>.</p><table><thead><tr><th>Type</th><th>Required</th><th>Platform</th></tr></thead><tbody><tr><td>enum('simple', 'highQuality', 'balanced')</td><td>No</td><td>Android</td></tr></tbody></table><hr><h3><a aria-hidden="true" tabindex="-1" class="anchor enhancedAnchor_3pqN" id="underlinecolorandroid"></a><code>underlineColorAndroid</code><a aria-hidden="true" tabindex="-1" class="hash-link" href="#underlinecolorandroid" title="Direct link to heading">#</a></h3><p>The color of the <code>TextInput</code> underline.</p><table><thead><tr><th>Type</th><th>Required</th><th>Platform</th></tr></thead><tbody><tr><td><a href="/docs/colors">color</a></td><td>No</td><td>Android</td></tr></tbody></table><hr><h3><a aria-hidden="true" tabindex="-1" class="anchor enhancedAnchor_3pqN" id="value"></a><code>value</code><a aria-hidden="true" tabindex="-1" class="hash-link" href="#value" title="Direct link to heading">#</a></h3><p>The value to show for the text input. <code>TextInput</code> is a controlled component, which means the native value will be forced to match this value prop if provided. For most uses, this works great, but in some cases this may cause flickering - one common cause is preventing edits by keeping value the same. In addition to setting the same value, either set <code>editable={false}</code>, or set/update <code>maxLength</code> to prevent unwanted edits without flicker.</p><table><thead><tr><th>Type</th><th>Required</th></tr></thead><tbody><tr><td>string</td><td>No</td></tr></tbody></table><h2><a aria-hidden="true" tabindex="-1" class="anchor enhancedAnchor_3pqN" id="methods"></a>Methods<a aria-hidden="true" tabindex="-1" class="hash-link" href="#methods" title="Direct link to heading">#</a></h2><h3><a aria-hidden="true" tabindex="-1" class="anchor enhancedAnchor_3pqN" id="focus"></a><code>.focus()</code><a aria-hidden="true" tabindex="-1" class="hash-link" href="#focus" title="Direct link to heading">#</a></h3><div class="mdxCodeBlock_xYIz"><div class="codeBlockContent_rlEb"><button tabindex="0" type="button" aria-label="Copy code to clipboard" class="copyButton_kOW4">Copy</button><div class="prism-code language-jsx codeBlock_1AP7"><div class="codeBlockLines_1boI" style="color:#FFFFFF;background:#282C34"><div class="token-line" style="color:#FFFFFF;background:#282C34"><span class="token function" style="color:#79b6f2">focus</span><span class="token punctuation" style="color:#657b83">(</span><span class="token punctuation" style="color:#657b83">)</span><span class="token punctuation" style="color:#657b83">;</span></div></div></div></div></div><p>Makes the native input request focus.</p><h3><a aria-hidden="true" tabindex="-1" class="anchor enhancedAnchor_3pqN" id="blur"></a><code>.blur()</code><a aria-hidden="true" tabindex="-1" class="hash-link" href="#blur" title="Direct link to heading">#</a></h3><div class="mdxCodeBlock_xYIz"><div class="codeBlockContent_rlEb"><button tabindex="0" type="button" aria-label="Copy code to clipboard" class="copyButton_kOW4">Copy</button><div class="prism-code language-jsx codeBlock_1AP7"><div class="codeBlockLines_1boI" style="color:#FFFFFF;background:#282C34"><div class="token-line" style="color:#FFFFFF;background:#282C34"><span class="token function" style="color:#79b6f2">blur</span><span class="token punctuation" style="color:#657b83">(</span><span class="token punctuation" style="color:#657b83">)</span><span class="token punctuation" style="color:#657b83">;</span></div></div></div></div></div><p>Makes the native input lose focus.</p><h3><a aria-hidden="true" tabindex="-1" class="anchor enhancedAnchor_3pqN" id="clear"></a><code>clear()</code><a aria-hidden="true" tabindex="-1" class="hash-link" href="#clear" title="Direct link to heading">#</a></h3><div class="mdxCodeBlock_xYIz"><div class="codeBlockContent_rlEb"><button tabindex="0" type="button" aria-label="Copy code to clipboard" class="copyButton_kOW4">Copy</button><div class="prism-code language-jsx codeBlock_1AP7"><div class="codeBlockLines_1boI" style="color:#FFFFFF;background:#282C34"><div class="token-line" style="color:#FFFFFF;background:#282C34"><span class="token function" style="color:#79b6f2">clear</span><span class="token punctuation" style="color:#657b83">(</span><span class="token punctuation" style="color:#657b83">)</span><span class="token punctuation" style="color:#657b83">;</span></div></div></div></div></div><p>Removes all text from the <code>TextInput</code>.</p><hr><h3><a aria-hidden="true" tabindex="-1" class="anchor enhancedAnchor_3pqN" id="isfocused"></a><code>isFocused()</code><a aria-hidden="true" tabindex="-1" class="hash-link" href="#isfocused" title="Direct link to heading">#</a></h3><div class="mdxCodeBlock_xYIz"><div class="codeBlockContent_rlEb"><button tabindex="0" type="button" aria-label="Copy code to clipboard" class="copyButton_kOW4">Copy</button><div class="prism-code language-jsx codeBlock_1AP7"><div class="codeBlockLines_1boI" style="color:#FFFFFF;background:#282C34"><div class="token-line" style="color:#FFFFFF;background:#282C34"><span class="token function" style="color:#79b6f2">isFocused</span><span class="token punctuation" style="color:#657b83">(</span><span class="token punctuation" style="color:#657b83">)</span><span class="token punctuation" style="color:#657b83">;</span></div></div></div></div></div><p>Returns <code>true</code> if the input is currently focused; <code>false</code> otherwise.</p><h1><a aria-hidden="true" tabindex="-1" class="anchor enhancedAnchor_3pqN" id="known-issues"></a>Known issues<a aria-hidden="true" tabindex="-1" class="hash-link" href="#known-issues" title="Direct link to heading">#</a></h1><ul><li><a href="https://github.com/facebook/react-native/issues/19096" target="_blank" rel="noopener noreferrer">react-native#19096</a>: Doesn't support Android's <code>onKeyPreIme</code>.</li><li><a href="https://github.com/facebook/react-native/issues/19366" target="_blank" rel="noopener noreferrer">react-native#19366</a>: Calling .focus() after closing Android's keyboard via back button doesn't bring keyboard up again.</li><li><a href="https://github.com/facebook/react-native/issues/26799" target="_blank" rel="noopener noreferrer">react-native#26799</a>: Doesn't support Android's <code>secureTextEntry</code> when <code>keyboardType="email-address"</code> or <code>keyboardType="phone-pad"</code>.</li></ul></div></article><div class="docMetadata margin-vert--xl"><div class="row"><div class="col"><a href="https://github.com/facebook/react-native-website/blob/master/website/versioned_docs/version-0.63/textinput.md" target="_blank" rel="noreferrer noopener"><svg fill="currentColor" height="1.2em" width="1.2em" preserveAspectRatio="xMidYMid meet" viewBox="0 0 40 40" style="margin-right:0.3em;vertical-align:sub"><g><path d="m34.5 11.7l-3 3.1-6.3-6.3 3.1-3q0.5-0.5 1.2-0.5t1.1 0.5l3.9 3.9q0.5 0.4 0.5 1.1t-0.5 1.2z m-29.5 17.1l18.4-18.5 6.3 6.3-18.4 18.4h-6.3v-6.2z"></path></g></svg>Edit this page</a></div><div class="col text--right"><em><small class="docMetadata-updated">Last updated on <time datetime="2020-12-30T09:29:13.000Z" class="docLastUpdatedAt_1gIo">12/30/2020</time></small></em></div></div></div><div class="margin-vert--lg"><nav class="pagination-nav" aria-label="Blog list page navigation"><div class="pagination-nav__item"><a class="pagination-nav__link" href="/docs/text"><div class="pagination-nav__sublabel">Previous</div><div class="pagination-nav__label">« Text</div></a></div><div class="pagination-nav__item pagination-nav__item--next"><a class="pagination-nav__link" href="/docs/touchablehighlight"><div class="pagination-nav__sublabel">Next</div><div class="pagination-nav__label">TouchableHighlight »</div></a></div></nav></div></div></div><div class="col col--3"><div class="tableOfContents_3iuQ"><ul class="table-of-contents table-of-contents__left-border"><li><a href="#props" class="table-of-contents__link">Props</a><ul><li><a href="#allowfontscaling" class="table-of-contents__link"><code>allowFontScaling</code></a></li><li><a href="#autocapitalize" class="table-of-contents__link"><code>autoCapitalize</code></a></li><li><a href="#autocompletetype" class="table-of-contents__link"><code>autoCompleteType</code></a></li><li><a href="#autocorrect" class="table-of-contents__link"><code>autoCorrect</code></a></li><li><a href="#autofocus" class="table-of-contents__link"><code>autoFocus</code></a></li><li><a href="#bluronsubmit" class="table-of-contents__link"><code>blurOnSubmit</code></a></li><li><a href="#carethidden" class="table-of-contents__link"><code>caretHidden</code></a></li><li><a href="#clearbuttonmode" class="table-of-contents__link"><code>clearButtonMode</code></a></li><li><a href="#cleartextonfocus" class="table-of-contents__link"><code>clearTextOnFocus</code></a></li><li><a href="#contextmenuhidden" class="table-of-contents__link"><code>contextMenuHidden</code></a></li><li><a href="#datadetectortypes" class="table-of-contents__link"><code>dataDetectorTypes</code></a></li><li><a href="#defaultvalue" class="table-of-contents__link"><code>defaultValue</code></a></li><li><a href="#disablefullscreenui" class="table-of-contents__link"><code>disableFullscreenUI</code></a></li><li><a href="#editable" class="table-of-contents__link"><code>editable</code></a></li><li><a href="#enablesreturnkeyautomatically" class="table-of-contents__link"><code>enablesReturnKeyAutomatically</code></a></li><li><a href="#importantforautofill" class="table-of-contents__link"><code>importantForAutofill</code></a></li><li><a href="#inlineimageleft" class="table-of-contents__link"><code>inlineImageLeft</code></a></li><li><a href="#inlineimagepadding" class="table-of-contents__link"><code>inlineImagePadding</code></a></li><li><a href="#inputaccessoryviewid" class="table-of-contents__link"><code>inputAccessoryViewID</code></a></li><li><a href="#keyboardappearance" class="table-of-contents__link"><code>keyboardAppearance</code></a></li><li><a href="#keyboardtype" class="table-of-contents__link"><code>keyboardType</code></a></li><li><a href="#maxfontsizemultiplier" class="table-of-contents__link"><code>maxFontSizeMultiplier</code></a></li><li><a href="#maxlength" class="table-of-contents__link"><code>maxLength</code></a></li><li><a href="#multiline" class="table-of-contents__link"><code>multiline</code></a></li><li><a href="#numberoflines" class="table-of-contents__link"><code>numberOfLines</code></a></li><li><a href="#onblur" class="table-of-contents__link"><code>onBlur</code></a></li><li><a href="#onchange" class="table-of-contents__link"><code>onChange</code></a></li><li><a href="#onchangetext" class="table-of-contents__link"><code>onChangeText</code></a></li><li><a href="#oncontentsizechange" class="table-of-contents__link"><code>onContentSizeChange</code></a></li><li><a href="#onendediting" class="table-of-contents__link"><code>onEndEditing</code></a></li><li><a href="#onfocus" class="table-of-contents__link"><code>onFocus</code></a></li><li><a href="#onkeypress" class="table-of-contents__link"><code>onKeyPress</code></a></li><li><a href="#onlayout" class="table-of-contents__link"><code>onLayout</code></a></li><li><a href="#onscroll" class="table-of-contents__link"><code>onScroll</code></a></li><li><a href="#onselectionchange" class="table-of-contents__link"><code>onSelectionChange</code></a></li><li><a href="#onsubmitediting" class="table-of-contents__link"><code>onSubmitEditing</code></a></li><li><a href="#placeholder" class="table-of-contents__link"><code>placeholder</code></a></li><li><a href="#placeholdertextcolor" class="table-of-contents__link"><code>placeholderTextColor</code></a></li><li><a href="#returnkeylabel" class="table-of-contents__link"><code>returnKeyLabel</code></a></li><li><a href="#returnkeytype" class="table-of-contents__link"><code>returnKeyType</code></a></li><li><a href="#rejectrespondertermination" class="table-of-contents__link"><code>rejectResponderTermination</code></a></li><li><a href="#scrollenabled" class="table-of-contents__link"><code>scrollEnabled</code></a></li><li><a href="#securetextentry" class="table-of-contents__link"><code>secureTextEntry</code></a></li><li><a href="#selection" class="table-of-contents__link"><code>selection</code></a></li><li><a href="#selectioncolor" class="table-of-contents__link"><code>selectionColor</code></a></li><li><a href="#selecttextonfocus" class="table-of-contents__link"><code>selectTextOnFocus</code></a></li><li><a href="#showsoftinputonfocus" class="table-of-contents__link"><code>showSoftInputOnFocus</code></a></li><li><a href="#spellcheck" class="table-of-contents__link"><code>spellCheck</code></a></li><li><a href="#textalign" class="table-of-contents__link"><code>textAlign</code></a></li><li><a href="#textcontenttype" class="table-of-contents__link"><code>textContentType</code></a></li><li><a href="#passwordrules" class="table-of-contents__link"><code>passwordRules</code></a></li><li><a href="#style" class="table-of-contents__link"><code>style</code></a></li><li><a href="#textbreakstrategy" class="table-of-contents__link"><code>textBreakStrategy</code></a></li><li><a href="#underlinecolorandroid" class="table-of-contents__link"><code>underlineColorAndroid</code></a></li><li><a href="#value" class="table-of-contents__link"><code>value</code></a></li></ul></li><li><a href="#methods" class="table-of-contents__link">Methods</a><ul><li><a href="#focus" class="table-of-contents__link"><code>.focus()</code></a></li><li><a href="#blur" class="table-of-contents__link"><code>.blur()</code></a></li><li><a href="#clear" class="table-of-contents__link"><code>clear()</code></a></li><li><a href="#isfocused" class="table-of-contents__link"><code>isFocused()</code></a></li></ul></li></ul></div></div></div></div></main></div></div><footer class="footer footer--dark"><div class="container"><div class="row footer__links"><div class="col footer__col"><h4 class="footer__title">Docs</h4><ul class="footer__items"><li class="footer__item"><a class="footer__link-item" href="/docs/getting-started">Getting Started</a></li><li class="footer__item"><a class="footer__link-item" href="/docs/tutorial">Tutorial</a></li><li class="footer__item"><a class="footer__link-item" href="/docs/components-and-apis">Components and APIs</a></li><li class="footer__item"><a class="footer__link-item" href="/docs/more-resources">More Resources</a></li></ul></div><div class="col footer__col"><h4 class="footer__title">Community</h4><ul class="footer__items"><li class="footer__item"><a class="footer__link-item" href="/help">The React Native Community</a></li><li class="footer__item"><a class="footer__link-item" href="/showcase">Who's using React Native?</a></li><li class="footer__item"><a href="https://stackoverflow.com/questions/tagged/react-native" target="_blank" rel="noopener noreferrer" class="footer__link-item">Ask Questions on Stack Overflow</a></li><li class="footer__item"><a href="https://github.com/facebook/react-native/blob/master/CONTRIBUTING.md" target="_blank" rel="noopener noreferrer" class="footer__link-item">Contributor Guide</a></li><li class="footer__item"><a href="https://dev.to/t/reactnative" target="_blank" rel="noopener noreferrer" class="footer__link-item">DEV Community</a></li></ul></div><div class="col footer__col"><h4 class="footer__title">Find us</h4><ul class="footer__items"><li class="footer__item"><a class="footer__link-item" href="/blog">Blog</a></li><li class="footer__item"><a href="https://twitter.com/reactnative" target="_blank" rel="noopener noreferrer" class="footer__link-item">Twitter</a></li><li class="footer__item"><a href="https://github.com/facebook/react-native" target="_blank" rel="noopener noreferrer" class="footer__link-item">GitHub</a></li></ul></div><div class="col footer__col"><h4 class="footer__title">More</h4><ul class="footer__items"><li class="footer__item"><a href="https://reactjs.org/" target="_blank" rel="noopener noreferrer" class="footer__link-item">React</a></li><li class="footer__item"><a href="https://opensource.facebook.com/legal/privacy" target="_blank" rel="noopener noreferrer" class="footer__link-item">Privacy Policy</a></li><li class="footer__item"><a href="https://opensource.facebook.com/legal/terms" target="_blank" rel="noopener noreferrer" class="footer__link-item">Terms of Service</a></li></ul></div></div><div class="text--center"><div class="margin-bottom--sm"><a href="https://opensource.facebook.com" target="_blank" rel="noopener noreferrer" class="footerLogoLink_19Ac"><img class="footer__logo" alt="Facebook Open Source Logo" src="/img/oss_logo.png"></a></div><div>Copyright © 2021 Facebook, Inc.</div></div></div></footer></div>
|
|
<script src="/styles.07d522c6.js"></script>
|
|
<script src="/runtime~main.0f285a6b.js"></script>
|
|
<script src="/main.5e05a427.js"></script>
|
|
<script src="/1.ba9ce8bd.js"></script>
|
|
<script src="/2.58cb5d3d.js"></script>
|
|
<script src="/1f391b9e.a824c215.js"></script>
|
|
<script src="/943.8b024446.js"></script>
|
|
<script src="/ee5b3385.b4fff665.js"></script>
|
|
<script src="/17896441.0c201679.js"></script>
|
|
<script src="/0fc9f0f5.d7050848.js"></script>
|
|
</body>
|
|
</html> |