メンションMentionExperimental
@ などのトリガー文字で候補を表示し、テキストエリアへメンションを挿入します。
プレビュー
状態とバリエーション
メンション候補
`@` 以降の入力に一致する候補を表示し、Enter キーまたはクリックで挿入します。
トリガー文字の変更
メンション以外の用途では、`#` のような別のトリガー文字も使えます。
無効化
編集できない理由はツールチップと補足文で伝えます。
プロパティ
表は横にスクロールできます
| プロパティ | 型 | 初期値 | 説明 |
|---|---|---|---|
| value | string | - | テキストエリアに表示する現在の入力内容です。 |
| onValueChange | (value: string) => void | - | 入力、または候補の挿入で値が変わった時に呼ばれます。 |
| trigger | string | '@' | 候補リストを開くための文字です。 |
| options | MentionOption[] | - | 候補として表示する項目です。`id`、`label`、任意の `hint` を渡します。 |
| maxSuggestions | number | 6 | 一度に表示する候補数の上限です。 |
| placeholder / disabled / rows | TextareaHTMLAttributes | - | テキストエリアに渡せる標準属性を指定できます。 |
使い方
Loading...