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

不多说，先看看效果把！

在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，才可以出发事件。

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

1、添加下拉框选项并设置样式 function addOption(){ $("#下拉框的id").append( "选项一" )$("#下拉框的id").append( "选项二" )//可以一个一个添加，也可以遍历要添加的数据循环添加 //两种方式设置样式 //1、直接设置下拉框的css $

下面是我给treeWidget加的右键。。。楼主参考下，改下就可以了

复制代码

private slots:

on_treeWidget_customContextMenuRequested(QPoint pos)

复制代码

ui->treeWidget->setContextMenuPolicy(Qt::CustomContextMenu)

void Composer::on_treeWidget_customContextMenuRequested(QPoint pos)

{

currentItem = ui->treeWidget->itemAt( pos )

if( currentItem == 0)

return

QMenu *treeWidgeMenu = new QMenu(ui->treeWidget)

treeWidgeMenu->addAction(ui->actionS_rename)

treeWidgeMenu->addAction(ui->actionCollpase_Rooms)

treeWidgeMenu->addAction(ui->actionUpdate_Driver)

treeWidgeMenu->addSeparator()

treeWidgeMenu->addAction(ui->actionS_delete)

treeWidgeMenu->exec(QCursor::pos())

}

---