66
77<p align =" center " ><a href =" ./README.md " >English</a > | 简体中文</p >
88
9-
109<div align =" center " >
1110
1211[ ![ NPM version] [ npm-image ]] [ npm-url ]
1817
1918</div >
2019
21-
2220## 特性
2321
2422- 文本区域提及基于前缀的搜索和选择。
@@ -81,54 +79,54 @@ npm start
8179
8280### Mentions
8381
84- | 参数 | 类型 | 默认值 | 说明 |
85- | ----------------- | ---------------------------------------------------------- | ------------- | ----------------------------------------------- |
82+ | 参数 | 类型 | 默认值 | 说明 |
83+ | ----------------- | ---------------------------------------------------------- | ------------- | ------------------------------ |
8684| allowClear | ` boolean \| { clearIcon?: ReactNode } ` | ` false ` | 显示文本区域值的清除按钮。 |
87- | autoFocus | ` boolean ` | ` false ` | 安装后聚焦文本区域。 |
88- | autoSize | ` boolean \| { minRows?: number; maxRows?: number } ` | - | 自动调整文本区域高度。 |
89- | children们 | ` ReactNode ` | - | ` Mentions.Option ` 小朋友。 |
90- | className | ` string ` | - | 根元素的className。 |
91- | classNames | ` MentionsProps['classNames'] ` | - | 插槽的语义className称。 |
92- | defaultValue | ` string ` | - | 初始值。 |
93- | direction | ` 'ltr' \| 'rtl' ` | ` ltr ` | 弹层方向。 |
94- | filterOption | ` false \| (input: string, option: OptionProps) => boolean ` | - | 自定义选项过滤。 |
95- | getPopupContainer | ` () => HTMLElement ` | - | 建议弹层窗口的容器。 |
96- | id | ` string ` | - | Textarea id. |
97- | notFoundContent | ` ReactNode ` | ` Not Found ` | 没有选项匹配时显示的内容。 |
98- | 选项 | ` DataDrivenOptionProps[] ` | - | 数据驱动的选项。 |
99- | placement | ` 'top' \| 'bottom' ` | ` bottom ` | 建议弹层窗口放置。 |
100- | popupClassName | ` string ` | - | 弹层窗口的className称。 |
101- | 前缀 | ` string \| string[] ` | ` @ ` | 触发前缀或前缀。 |
102- | prefixCls | ` string ` | ` rc-mentions ` | className前缀。 |
103- | rows | ` number ` | ` 1 ` | Textarea row count. |
104- | silent | ` boolean ` | ` false ` | 忽略过渡阶段的 Enter 行为。 |
105- | split | ` string ` | ` ' ' ` | 在选定的提及之后插入的字符串。 |
106- | 风格 | ` React.CSSProperties ` | - | 根元素的内联样式。 |
107- | styles | ` MentionsProps['styles'] ` | - | Semantic styles for slots. |
108- | transitionName | ` string ` | - | 弹层过渡名称。 |
109- | validateSearch | ` (text: string, split: MentionsProps['split']) => boolean ` | - | 自定义触发搜索逻辑。 |
110- | 价值 | ` string ` | - | 受控值。 |
111- | onBlur | ` React.FocusEventHandler<HTMLTextAreaElement> ` | - | 当文本区域失去焦点时触发。 |
112- | onChange | ` (text: string) => void ` | - | 当值改变时触发。 |
113- | onFocus | ` React.FocusEventHandler<HTMLTextAreaElement> ` | - | 当文本区域获得焦点时触发。 |
114- | onKeyDown | ` React.KeyboardEventHandler<HTMLTextAreaElement> ` | - | Triggered on key down. |
115- | onKeyUp | ` React.KeyboardEventHandler<HTMLTextAreaElement> ` | - | Triggered on key up. |
116- | onPopupScroll | ` (event: React.UIEvent<HTMLDivElement>) => void ` | - | 当弹层窗口滚动时触发。 |
117- | onPressEnter | ` React.KeyboardEventHandler<HTMLTextAreaElement> ` | - | 当按下 Enter 时触发。 |
118- | onResize | ` (size: { width: number; height: number }) => void ` | - | 当文本区域大小改变时触发。 |
119- | onSearch | ` (text: string, prefix: string) => void ` | - | 当前缀开始搜索时触发。 |
120- | onSelect | ` (option: OptionProps, prefix: string) => void ` | - | 选择选项时触发。 |
85+ | autoFocus | ` boolean ` | ` false ` | 安装后聚焦文本区域。 |
86+ | autoSize | ` boolean \| { minRows?: number; maxRows?: number } ` | - | 自动调整文本区域高度。 |
87+ | children | ` ReactNode ` | - | ` Mentions.Option ` 小朋友。 |
88+ | className | ` string ` | - | 根元素的className。 |
89+ | classNames | ` MentionsProps['classNames'] ` | - | 插槽的语义className称。 |
90+ | defaultValue | ` string ` | - | 初始值。 |
91+ | direction | ` 'ltr' \| 'rtl' ` | ` ltr ` | 弹层方向。 |
92+ | filterOption | ` false \| (input: string, option: OptionProps) => boolean ` | - | 自定义选项过滤。 |
93+ | getPopupContainer | ` () => HTMLElement ` | - | 建议弹层窗口的容器。 |
94+ | id | ` string ` | - | Textarea id. |
95+ | notFoundContent | ` ReactNode ` | ` Not Found ` | 没有选项匹配时显示的内容。 |
96+ | options | ` DataDrivenOptionProps[] ` | - | 数据驱动的选项。 |
97+ | placement | ` 'top' \| 'bottom' ` | ` bottom ` | 建议弹层窗口放置。 |
98+ | popupClassName | ` string ` | - | 弹层窗口的className称。 |
99+ | prefix | ` string \| string[] ` | ` @ ` | 触发前缀或前缀。 |
100+ | prefixCls | ` string ` | ` rc-mentions ` | className前缀。 |
101+ | rows | ` number ` | ` 1 ` | Textarea row count. |
102+ | silent | ` boolean ` | ` false ` | 忽略过渡阶段的 Enter 行为。 |
103+ | split | ` string ` | ` ' ' ` | 在选定的提及之后插入的字符串。 |
104+ | style | ` React.CSSProperties ` | - | 根元素的内联样式。 |
105+ | styles | ` MentionsProps['styles'] ` | - | Semantic styles for slots. |
106+ | transitionName | ` string ` | - | 弹层过渡名称。 |
107+ | validateSearch | ` (text: string, split: MentionsProps['split']) => boolean ` | - | 自定义触发搜索逻辑。 |
108+ | value | ` string ` | - | 受控值。 |
109+ | onBlur | ` React.FocusEventHandler<HTMLTextAreaElement> ` | - | 当文本区域失去焦点时触发。 |
110+ | onChange | ` (text: string) => void ` | - | 当值改变时触发。 |
111+ | onFocus | ` React.FocusEventHandler<HTMLTextAreaElement> ` | - | 当文本区域获得焦点时触发。 |
112+ | onKeyDown | ` React.KeyboardEventHandler<HTMLTextAreaElement> ` | - | Triggered on key down. |
113+ | onKeyUp | ` React.KeyboardEventHandler<HTMLTextAreaElement> ` | - | Triggered on key up. |
114+ | onPopupScroll | ` (event: React.UIEvent<HTMLDivElement>) => void ` | - | 当弹层窗口滚动时触发。 |
115+ | onPressEnter | ` React.KeyboardEventHandler<HTMLTextAreaElement> ` | - | 当按下 Enter 时触发。 |
116+ | onResize | ` (size: { width: number; height: number }) => void ` | - | 当文本区域大小改变时触发。 |
117+ | onSearch | ` (text: string, prefix: string) => void ` | - | 当前缀开始搜索时触发。 |
118+ | onSelect | ` (option: OptionProps, prefix: string) => void ` | - | 选择选项时触发。 |
121119
122120### Option
123121
124- | 参数 | 类型 | 默认值 | 说明 |
125- | --------- | --------------------- | ------- | ----------------------------------------- |
126- | children们 | ` ReactNode ` | - | 选项标签。 |
127- | className | ` string ` | - | 选项的className称。 |
128- | disabled | ` boolean ` | ` false ` | 禁用该选项。 |
129- | key | ` string ` | - | React键和选项键。 |
130- | 风格 | ` React.CSSProperties ` | - | 内联选项样式。 |
131- | 价值 | ` string ` | - | 提及插入文本区域的值。 |
122+ | 参数 | 类型 | 默认值 | 说明 |
123+ | --------- | --------------------- | ------- | ---------------------- |
124+ | children | ` ReactNode ` | - | 选项标签。 |
125+ | className | ` string ` | - | 选项的className称。 |
126+ | disabled | ` boolean ` | ` false ` | 禁用该选项。 |
127+ | key | ` string ` | - | React键和选项键。 |
128+ | style | ` React.CSSProperties ` | - | 内联选项样式。 |
129+ | value | ` string ` | - | 提及插入文本区域的值。 |
132130
133131### Ref
134132
@@ -141,10 +139,10 @@ ref.current?.focus();
141139ref .current ?.blur ();
142140```
143141
144- | 参数 | 类型 | 说明 |
145- | ------------- | ----------------------------- | ------------------------------ |
146- | 重点 | ` () => void ` | 聚焦文本区域。 |
147- | 模糊 | ` () => void ` | 模糊文本区域。 |
142+ | 参数 | 类型 | 说明 |
143+ | ------------- | ----------------------------- | ---------------------- |
144+ | focus | ` () => void ` | 聚焦文本区域。 |
145+ | blur | ` () => void ` | 模糊文本区域。 |
148146| textarea | ` HTMLTextAreaElement \| null ` | 已弃用的文本区域参考。 |
149147| nativeElement | ` HTMLElement ` | 根原生元素。 |
150148
0 commit comments