element UI表格中设置文字提示(tooltip)或弹出框(popover)
element
A Vue.js 2.0 UI Toolkit for Web
项目地址:https://gitcode.com/gh_mirrors/eleme/element
免费下载资源
·
@element UI表格中设置文字提示(tooltip)或弹出框(popover)
1、文字提示
<el-table-column prop="name" label="姓名" width="180">
<template slot-scope="scope">
<el-tooltip placement="top">
<div slot="content">多行信息<br />第二行信息</div>
<p slot="reference">{{ scope.row.date }}</p>
</el-tooltip>
</template>
</el-table-column>
2、弹出框
文档中有两种写法:
1、使用 slot=“reference” 的具名插槽
<el-table-column prop="date" label="日期" width="180">
<template slot-scope="scope">
<el-popover
placement="bottom"
title="标题"
width="200"
trigger="click"
content="你自己定义的内容"
>
<p slot="reference">{{ scope.row.date }}</p>
</el-popover>
</template>
</el-table-column>
2、使用自定义指令v-popover指向 Popover 的索引ref。
GitHub 加速计划 / eleme / element
54.06 K
14.63 K
下载
A Vue.js 2.0 UI Toolkit for Web
最近提交(Master分支:3 个月前 )
c345bb45
7 个月前
a07f3a59
* Update transition.md
* Update table.md
* Update transition.md
* Update table.md
* Update transition.md
* Update table.md
* Update table.md
* Update transition.md
* Update popover.md 7 个月前
更多推荐
已为社区贡献1条内容
所有评论(0)