javascript/ionic-framework
1
0
Fork 0
mirror of https://github.com/ionic-team/ionic-framework.git synced 2026-03-13 10:22:08 +08:00
Code Issues Packages Projects Releases Wiki Activity

docs(react): update component usage docs (#17615)

Browse Source
This commit is contained in:
Josh Thomas
2019-02-26 08:54:01 -06:00
committed by GitHub
parent f44c17e03b
commit 22d1aeebaa
113 changed files with 7207 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

52
core/src/components/input/usage/react.md Normal file
View File

@@ -0,0 +1,52 @@
```tsx
import React from 'react';
import { IonInput, IonItem, IonLabel } from '@ionic/react';
const Example: React.SFC<{}> = () => (
<>
{/*-- Default Input --*/}
<IonInput></IonInput>
{/*-- Input with value --*/}
<IonInput value="custom"></IonInput>
{/*-- Input with placeholder --*/}
<IonInput placeholder="Enter Input"></IonInput>
{/*-- Input with clear button when there is a value --*/}
<IonInput clearInput value="clear me"></IonInput>
{/*-- Number type input --*/}
<IonInput type="number" value="333"></IonInput>
{/*-- Disabled input --*/}
<IonInput value="Disabled" disabled></IonInput>
{/*-- Readonly input --*/}
<IonInput value="Readonly" readonly></IonInput>
{/*-- Inputs with labels --*/}
<IonItem>
<IonLabel>Default Label</IonLabel>
<IonInput></IonInput>
</IonItem>
<IonItem>
<IonLabel position="floating">Floating Label</IonLabel>
<IonInput></IonInput>
</IonItem>
<IonItem>
<IonLabel position="fixed">Fixed Label</IonLabel>
<IonInput></IonInput>
</IonItem>
<IonItem>
<IonLabel position="stacked">Stacked Label</IonLabel>
<IonInput></IonInput>
</IonItem>
</>
);
export default Example