🌈 An enterprise-class UI components based on Ant Design and Vue. 🐜
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 

2.9 KiB

category type title subtitle cover coverDark
Components 数据录入 Mentions 提及 https://mdn.alipayobjects.com/huamei_7uahnr/afts/img/A*e4bXT7Uhi9YAAAAAAAAAAAAADrJ8AQ/original https://mdn.alipayobjects.com/huamei_7uahnr/afts/img/A*pxR2S53P_xoAAAAAAAAAAAAADrJ8AQ/original

提及组件。

何时使用

  • 用于在输入中提及某人或某事,常用于发布、聊天或评论功能。

API

Mentions

参数 说明 类型 默认值
autofocus 自动获得焦点 boolean false
defaultValue 默认值 string
filterOption 自定义过滤逻辑 false | (input: string, option: OptionProps) => boolean
getPopupContainer 指定建议框挂载的 HTML 节点 () => HTMLElement
notFoundContent 当下拉列表为空时显示的内容 string | slot 'Not Found'
placement 弹出层展示位置 top | bottom bottom
prefix 设置触发关键字 string | string[] '@'
split 设置选中项前后分隔符 string ' '
status 设置校验状态 'error' | 'warning' - 3.3.0
validateSearch 自定义触发验证逻辑 (text: string, props: MentionsProps) => void
value(v-model) 设置值 string
options 选项配置 Options [] 4.0
option 通过 option 插槽,自定义节点 v-slot:option="option" - 4.0

事件

事件名称 说明 回调参数
blur 失去焦点的时回调 function
change 值改变时触发 function(value: string)
focus 获得焦点时回调 function
search 文本框值变化时回调 function(value: string, prefix: string)
select 选择选项时触发 function(option: OptionProps, prefix: string)

Mentions 方法

名称 描述
blur() 移除焦点
focus() 获取焦点

Mention.Option (< 4.0)

参数 说明 类型 默认值
value 选择时填充的值 string ''

Option

Support from v4.0

参数 说明 类型 默认值
value 选择时填充的值 string number
label 选项的标题 VueNode (o: Option)=> VueNode
disabled 是否可选 boolean -
class css 类名 string -
style 选项样式 CSSProperties -
payload 其它数据 object -