今天分享的不是技術(shù)，今天給大家分享個(gè)插件，針對(duì)現(xiàn)有的vue右鍵菜單插件，大多數(shù)都是需要使用插件本身自定義的標(biāo)簽，很多地方不方便，可擴(kuò)展性也很低，所以我決定寫了一款自定義指令調(diào)用右鍵菜單（vuerightmenu）

十載專注成都網(wǎng)站制作，成都企業(yè)網(wǎng)站建設(shè)，個(gè)人網(wǎng)站制作服務(wù)，為大家分享網(wǎng)站制作知識(shí)、方案，網(wǎng)站設(shè)計(jì)流程、步驟,成功服務(wù)上千家企業(yè)。為您提供網(wǎng)站建設(shè),網(wǎng)站制作,網(wǎng)頁設(shè)計(jì)及定制高端網(wǎng)站建設(shè)服務(wù),專注于成都企業(yè)網(wǎng)站建設(shè),高端網(wǎng)頁制作,對(duì)成都宴會(huì)酒店設(shè)計(jì)等多個(gè)行業(yè)，擁有豐富設(shè)計(jì)經(jīng)驗(yàn)。

　　安裝

 npm install rightmenu --save-dev

 　　開始

//main.js
import vue from "vue";
import rightMenu from "rightMenu";
vue.use(rightMenu);

　　例子

補(bǔ)充說明

main.js引入并use之后，會(huì)增加全局指令v-rightMenu ，value為一個(gè)對(duì)象,value內(nèi)所有api均已在上面例子說明，可為空的參數(shù)就可以不填寫，都會(huì)有默認(rèn)值或者本身就是可有可無的

本插件優(yōu)缺點(diǎn)說明

相比較于大眾化的右鍵插件他有如下優(yōu)點(diǎn)：

•　　插件精悍短小，運(yùn)行速度快
•　　不需要單獨(dú)配置任何邊界檢測(cè)，插件本身自帶了
•　　樣式完全根據(jù)用戶需求，自定義菜單的任何地方的樣式
•      使用簡(jiǎn)單，一個(gè)指令即可調(diào)用
•      不會(huì)為頁面渲染無用的dom，一切都是在你第一次使用時(shí)候才會(huì)進(jìn)行加載，并且保證在之后的多次使用中，不會(huì)渲染多余dom
•　　支持菜單文字（content字段）使用html ，沒錯(cuò)，你可以使用字體圖標(biāo)而不用拘泥于插件自身的圖片圖標(biāo)，也可以使用不同的標(biāo)簽來表示你的菜單（當(dāng)然我也考慮了如此做法，可能需要你必須要完整的吧標(biāo)簽寫出來，否則可能會(huì)報(bào)錯(cuò)，這個(gè)問題后期我會(huì)進(jìn)行修復(fù)，先看看效果）

　　缺點(diǎn)說明：

•　　因?yàn)楸静藛螌?shí)現(xiàn)的是高度自定義，所以可能會(huì)讓使用者需要定義很多樣式，我只寫了一些必要的樣式，其余全部需要使用者來自定義（我也不知道這是個(gè)缺點(diǎn)還是優(yōu)點(diǎn)，不過如果我是使用者我會(huì)覺得還是插件本身不帶有很多的樣式為好）
•      因?yàn)樵O(shè)計(jì)插件時(shí)候，沒有考慮到圖標(biāo)問題，所以導(dǎo)致后期有人和我說想要圖標(biāo)的時(shí)候，我加入圖標(biāo)功能進(jìn)去，會(huì)導(dǎo)致圖片稍微高于文字一些，這個(gè)小bug也是css本身自帶的，而這個(gè)小bug恰好卡在了項(xiàng)目的痛點(diǎn)，也不算痛點(diǎn)吧，只是我工作上有一些事情也必須要盡快處理，而這個(gè)問題所以為了彌補(bǔ)這個(gè)問題，我加入了content內(nèi)支持了html，也就是說如果你的要求很高，對(duì)視覺上，我建議你用字體圖標(biāo)，至于圖片與文字的問題，我會(huì)在短期內(nèi)盡快修復(fù)，修復(fù)好，我會(huì)第一時(shí)間發(fā)布

本插件旨在實(shí)現(xiàn)的是靈活 + 低配置 + 擴(kuò)展性高 + 指令調(diào)用的快速右鍵菜單，正如你看到的我只需要一個(gè)指令，一個(gè)json，僅此而已。本插件對(duì)于新人還是老手均能適用，因?yàn)楸静寮且豢顢U(kuò)展性極高的插件，支持你配置菜單總樣式、菜單選項(xiàng)樣式、點(diǎn)擊的回調(diào)函數(shù)、菜單選項(xiàng)的icon 甚至你能定義每一單獨(dú)選項(xiàng)的樣式以及icon。最后感謝大家的支持，如果喜歡的話請(qǐng)到github（https://github.com/JinZhenZon/rightmenu）為本插件點(diǎn)個(gè)star吧。

以上所述是小編給大家介紹的vue 右鍵菜單插件 簡(jiǎn)單、可擴(kuò)展、樣式自定義的右鍵菜單，希望對(duì)大家有所幫助，如果大家有任何疑問請(qǐng)給我留言，小編會(huì)及時(shí)回復(fù)大家的。在此也非常感謝大家對(duì)創(chuàng)新互聯(lián)網(wǎng)站的支持！