在elementPLUS中,可以使用下拉菜单组件来实现这个功能。首先,在按钮中添加一个下拉菜单组件el-dropdown,并给它设置一个唯一的标识符id。

<el-dropdown id="dropdown">
  <el-button type="success" plain @click="openDialog()"><i-ep-plus />添加</el-button>
  <el-dropdown-menu slot="dropdown">
    <el-dropdown-item @click="openForm('分类')">添加分类</el-dropdown-item>
    <el-dropdown-item @click="openForm('组织机构')">添加组织机构</el-dropdown-item>
  </el-dropdown-menu>
</el-dropdown>

然后,在对应的Vue组件中,添加打开弹出表单的方法openForm,并根据参数来确定打开的表单类型。

methods: {
  openDialog() {
    // 打开下拉菜单
    const dropdown = this.$refs.dropdown
    dropdown.show()
  },
  openForm(type) {
    // 根据类型打开对应的表单
    if (type === '分类') {
      // 打开分类表单
    } else if (type === '组织机构') {
      // 打开组织机构表单
    }
  }
}

这样,当用户点击按钮时,下拉菜单会显示出来,然后根据用户点击的菜单项来确定打开的表单类型。你可以根据具体的需求来实现打开表单的逻辑

el-button type=success plain click=openDialogi-ep-plus 添加el-button在elementPLUS中这个按钮的图标带一个倒三角图形鼠标点击按钮显示下拉菜单一个是添加分类另一个是添加组织机构。鼠标单击其中一个菜单后弹出表单。

原文地址: https://www.cveoy.top/t/topic/iwuS 著作权归作者所有。请勿转载和采集!

免费AI点我,无需注册和登录