美文网首页vue2.0+iview开发商户后台那些事?
iview表格table中,如何添加Dropdown 下拉菜单

iview表格table中,如何添加Dropdown 下拉菜单

作者: 一个被程序员耽误的厨师 | 来源:发表于2018-05-23 16:59 被阅读2024次

不多说,先看看效果把!

在iview中Table表格中有一个列描述数据对象(render),render是 columns 中的一项,自定义渲染列,使用 Vue 的 Render 函数。传入两个参数,第一个是 h,第二个为对象,包含 row、column 和 index,分别指当前行数据,当前列数据,当前行索引。

当然官网提供一个简单的使用方法:iView - A high quality UI Toolkit based on Vue.js

现在我们来实现,添加一个Dropdown 下拉菜单:

这里要注意下我描述的,1,2,3,4点,先不急,咱们先看下官网这个Dropdown组件

不难看出,讲一个组件写成render其实很简单,只需要写成这样

最后就是要注意下,绑定事件了,这里的on要写成nativeOn,才可以出发事件。

不知道  小伙伴看懂了原理吗?不明白就留言,我会及时回复你的。

相关文章

网友评论

    本文标题:iview表格table中,如何添加Dropdown 下拉菜单

    本文链接:https://www.haomeiwen.com/subject/nborjftx.html