ant-design/components/mention/index.zh-CN.md

69 lines
2.6 KiB
Markdown
Raw Normal View History

2016-07-04 10:31:27 +08:00
---
category: Components
2016-09-21 11:28:38 +08:00
subtitle: 提及
type: 数据录入
2016-09-21 11:28:38 +08:00
title: Mention
2016-07-04 10:31:27 +08:00
---
2016-07-21 15:23:04 +08:00
提及组件。
2016-07-04 10:31:27 +08:00
## 何时使用
2016-07-21 15:41:40 +08:00
用于在输入中提及某人或某事,常用于发布、聊天或评论功能。
## API
2016-07-04 10:31:27 +08:00
2016-07-21 15:23:04 +08:00
```jsx
<Mention
onChange={onChange}
suggestions={['afc163', 'benjycui', 'yiminghe', 'jljsj33', 'dqaria', 'RaoHai']}
/>
2016-07-04 10:31:27 +08:00
```
### Mention API
2017-10-25 10:25:44 +08:00
| API | 说明 | 类型 |
| --- | --- | --- |
| getMentions | 获取当前 contentState 中提到的人的列表 | Function(contentState: ContentState): string\[] |
2017-11-30 09:53:32 +08:00
| toContentState | 把字符串转成 ContentState | Function(value: string): ContentState |
2017-10-25 10:25:44 +08:00
| toString | 把 ContentState 转成字符串 | Function(contentState: ContentState): string |
2017-06-16 16:56:03 +08:00
### Mention
2016-07-04 10:31:27 +08:00
2017-10-25 10:25:44 +08:00
| 参数 | 说明 | 类型 | 默认值 |
| --- | --- | --- | --- |
| autoFocus | 自动获取焦点 | boolean | false |
2017-11-30 09:53:32 +08:00
| defaultValue | 默认值 | ContentState, 可以用 `Mention.toContentState(text)` 把文字转换成 ContentState | null |
2018-12-18 19:51:35 +08:00
| defaultSuggestions | 默认建议内容 | Array&lt;string\|Mention.Nav> | \[] |
2017-10-25 10:25:44 +08:00
| disabled | 是否禁用状态. | boolean | false |
| getSuggestionContainer | 菜单渲染父节点。默认渲染到 body 上,如果你遇到菜单滚动定位问题,试试修改为滚动的区域,并相对其定位 | function() | () => document.body |
2016-07-04 10:31:27 +08:00
| loading | 加载中 | boolean | false |
| multiLines | 多行模式 | boolean | false |
2017-10-25 10:25:44 +08:00
| notFoundContent | 未找到时的内容 | string | '无匹配结果,轻敲空格完成输入' |
2017-01-22 19:49:08 +08:00
| placeholder | 输入框默认文字 | string | null |
2017-10-25 10:27:38 +08:00
| placement | 建议框位置,可选 `top` `bottom` | string | 'bottom' |
| prefix | 触发弹出下拉框的字符 | string or Array&lt;string> | '@' |
2017-10-25 10:25:44 +08:00
| readOnly | 是否只读. | boolean | false |
| suggestions | 建议内容 | Array&lt;string\|Mention.Nav> | \[] |
| suggestionStyle | 弹出下拉框样式 | object | {} |
| value | 值 | ContentState | null |
2017-04-15 14:19:09 +08:00
| onBlur | 失去焦点时回调 | function(e) | null |
2017-10-25 10:25:44 +08:00
| onChange | 输入框内容变化时回调 | function(contentState: ContentState) | null |
| onFocus | 获得焦点时回调 | function(e) | null |
| onSearchChange | 输入框中 @ 变化时回调 | function(value:string, trigger: string) | \[] |
| onSelect | 下拉框选择建议时回调 | function(suggestion: string, data?: any) | null |
2016-07-04 10:31:27 +08:00
### Mention 方法
| 名称 | 描述 |
2017-12-29 20:22:58 +08:00
| --- | --- |
| blur() | 移除焦点 |
2017-12-29 20:22:58 +08:00
| focus() | 获取焦点 |
2017-06-16 16:56:03 +08:00
### Nav
2016-07-04 10:31:27 +08:00
2017-10-25 10:25:44 +08:00
| 参数 | 说明 | 类型 | 默认值 |
| --- | --- | --- | --- |
| children | 建议内容 | object | {} |
2017-10-25 10:25:44 +08:00
| value | 建议值,选择建议时,用此值插入到输入框中 | string | "" |