import{_ as a,c as l,o as p,V as s,z as n}from"./chunks/framework.f7d2e3c3.js";const f=JSON.parse('{"title":"右键菜单","description":"","frontmatter":{},"headers":[],"relativePath":"component/contextmenu.md","lastUpdated":1682229030000}'),o={name:"component/contextmenu.md"},e=s('

右键菜单 ​

配置 ​

属性类型描述
disableBoolean是否禁用组件
nameString组件唯一名称，用于标记类名
indexNumber组件索引，用于显示的优先级
htmlString, Element组件的 DOM 元素
styleObject组件样式对象
clickFunction组件点击事件
mountedFunction组件挂载后触发
tooltipString组件的提示文本

创建 ​

',4),t=n("div",{className:"run-code"},"▶ Run Code",-1),r=s(`
js
var art = new Artplayer({
    container: '.artplayer-app',
    url: '/assets/sample/video.mp4',
    contextmenu: [
        {
            name: 'your-menu',
            html: 'Your Menu',
            click: function (...args) {
                console.info(args);
                art.contextmenu.show = false;
            },
        },
    ],
});

art.contextmenu.show = true;

// Get the Element of contextmenu by name
console.info(art.contextmenu['your-menu']);

添加 ​

`,2),c=n("div",{className:"run-code"},"▶ Run Code",-1),D=s(`
js
var art = new Artplayer({
    container: '.artplayer-app',
    url: '/assets/sample/video.mp4',
});

art.contextmenu.add({
    name: 'your-menu',
    html: 'Your Menu',
    click: function (...args) {
        console.info(args);
        art.contextmenu.show = false;
    },
});

art.contextmenu.show = true;

// Get the Element of contextmenu by name
console.info(art.contextmenu['your-menu']);

删除 ​

`,2),F=n("div",{className:"run-code"},"▶ Run Code",-1),y=s(`
js
var art = new Artplayer({
    container: '.artplayer-app',
    url: '/assets/sample/video.mp4',
    contextmenu: [
        {
            name: 'your-menu',
            html: 'Your Menu',
            click: function (...args) {
                console.info(args);
                art.contextmenu.show = false;
            },
        },
    ],
});

art.contextmenu.show = true;

art.on('ready', () => {
    setTimeout(() => {
        // Delete the contextmenu by name
        art.contextmenu.remove('your-menu')
    }, 3000);
});

更新 ​

`,2),A=n("div",{className:"run-code"},"▶ Run Code",-1),i=s(`
js
var art = new Artplayer({
    container: '.artplayer-app',
    url: '/assets/sample/video.mp4',
    contextmenu: [
        {
            name: 'your-menu',
            html: 'Your Menu',
            click: function (...args) {
                console.info(args);
                art.contextmenu.show = false;
            },
        },
    ],
});

art.contextmenu.show = true;

art.on('ready', () => {
    setTimeout(() => {
        // Update the contextmenu by name
        art.contextmenu.update({
            name: 'your-menu',
            html: 'Your New Menu',
        })
    }, 3000);
});
`,1),C=[e,t,r,c,D,F,y,A,i];function d(b,u,m,h,_,g){return p(),l("div",null,C)}const x=a(o,[["render",d]]);export{f as __pageData,x as default};