antd-designed-vue
popover
基本使用
<a-popover>
<a href="javascript:;">Invite 一 {{record.name}}</a>
<template slot="content">
<div>Hello world!!!</div>
<div>Hello World</div>
</template>
<span slot="title">Title</span>
</a-popover>
title
设置标题 string|slot|vNode
content
设置主要内容 string|slot|vNode
placement
可以设置十二个方向
trigger
设置触发方式 'focus|click|hover'
arrowPointAtCenter
设置箭头是否指向组件中心 boolean
avatar
<a-avatar> </a-avatar>
shape
头像形状 Enum{ 'circle', 'square' }
icon
制定头像图标 string
size
指定头像大小 number|Enum{ 'large', 'small', 'default' }
src
指定头像链接地址
alt
指定头像无法显示时替代文本
loadError
图片加载失败返回的事件,返回boolean
badge
<a-badge count="10"></a-badge>
count
需要显示的数字
numberStyle
自定义显示的样式
overflowCount
超出某个数字时显示 +
status
小点表示状态
offset
偏移状态 [x, y]
card
title
标题 string | slot
loading
显示加载状态 boolean
cover
封面 slot
extra
右上角可操作区域 slot| string
bodered
是否有边框 boolean
actions
底部可操作区域
tabList
页签标题列表, 可以通过scopedSlots属性自定义tab Array<{key: string, tab: any, scopedSlots: {tab: 'XXX'}}>
activeTabKey
当前标签页激活的key
defaultActiveKey
默认的tabkey
list
list 作为列表渲染使用
<a-list>
<a-list-item>
...
</a-list-item>
</a-list>
itemLayout
列表元素的渲染方向
dataSource
主数据源
bordered
是否带边框
header
列表头部 string|slot
footer
列表尾部 string|slot
split
是否带分割线
loading
首次加载时填充
renderItem
作为渲染列表子元素的插槽 slot
grid
用于itemLayout 为 horizontial 时使用 { gutter: 20, column: 2}, 用于渲染多列列表
rowKey
key的取值 item => string|number
pagination
和 loadMore
有些冲突,需要再次验证
List.Item
extra
额外内容, 通常用在 itemLayout 为 vertical 的情况下, 展示右侧内容; horizontal 展示在列表元素最右侧
actions
列表操作组,根据 itemLayout 的不同, 位置在卡片底部或者最右侧
网友评论