vue怎么实现右键二级菜单_原生Vue 实现右键菜单组件功能

Vue 原生实现右键菜单组件, 零依赖

快速安装

npm install vue-contextmenujs

使用

测试中使用的是 element-ui 图标

import Contextmenu from "vue-contextmenujs"

Vue.use(Contextmenu);

export default {

methods: {

onContextmenu(event) {

this.$contextmenu({

items: [

{

label: "返回(B)",

onClick: () => {

this.message = "返回(B)";

console.log("返回(B)");

}

},

{ label: "前进(F)", disabled: true },

{ label: "重新加载(R)", divided: true, icon: "el-icon-refresh" },

{ label: "另存为(A)..." },

{ label: "打印(P)...", icon: "el-icon-printer" },

{ label: "投射(C)...", divided: true },

{

label: "使用网页翻