源代码
<template>
<div>
<h2>Context Menu</h2>
<div @contextmenu.prevent="$refs.m1.showContextMenu($event.pageX,$event.pageY)" class="f-row f-content-center" style="width:400px;height:200px;border:1px solid #ddd">
<p>Right click here to open the Menu.</p>
</div>
<Menu ref="m1">
<MenuItem text="New"></MenuItem>
<MenuItem text="Open">
<SubMenu>
<MenuItem text="Word"></MenuItem>
<MenuItem text="Excel"></MenuItem>
<MenuItem text="PowerPoint"></MenuItem>
</SubMenu>
</MenuItem>
<MenuItem text="Save" iconCls="icon-save"></MenuItem>
<MenuItem text="Print" iconCls="icon-print" :disabled="true"></MenuItem>
<MenuItem text="Exit"></MenuItem>
</Menu>
</div>
</template>
<script>
export default {};
</script>