Input
Inputは、1行のテキストやファイルなどを入力するためのコンポーネントです。
プレースホルダーやラベル、ボタンとの組み合わせなど、さまざまなユースケースに対応しています。
プロパティ
Inputは、以下のプロパティをサポートしています。
名前 | 型 | デフォルト値 | 説明 |
---|---|---|---|
type |
string |
text |
入力の種類を指定します。 |
placeholder |
string |
なし | 入力欄に表示されるヒントテキストです。 |
readonly |
boolean |
false |
読み取り専用の状態にします。編集はできません。 |
disabled |
boolean |
false |
入力を無効化します。操作できません。 |
isError |
boolean |
false |
エラー状態を視覚的に示します。バリデーション用など。 |
インストールの手順
以下のコンポーネントのコードを、使いたいプロジェクトにコピー&ペーストします。
パスは実際のプロジェクトの構成にあわせて更新してください。
使い方
サンプル
Text
基本的なテキスト入力の状態です。
Readonly
内容を編集できない、読み取り専用の状態です。
Error
入力内容に問題があり、エラーが表示されている状態です。
Disabled
利用不可の状態です。
With Label
入力フィールドとラベルを組み合わせた例です。
With Button
入力フィールドとボタンを組み合わせた例です。