Skip to content

Commit c2809bf

Browse files
imengyuimengyu
committed
Add parcel test project
1 parent a09088a commit c2809bf

File tree

8 files changed

+4949
-0
lines changed

8 files changed

+4949
-0
lines changed

‎parcel-project/.gitignore

+2
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,2 @@
1+
.cache/
2+
dist/

‎parcel-project/.hintrc

+5
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
{
2+
"extends": [
3+
"development"
4+
]
5+
}

‎parcel-project/App.vue

+69
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,69 @@
1+
<script setup lang="js">
2+
import ContextMenuGlobal from '@imengyu/vue3-context-menu'
3+
import { ref } from 'vue';
4+
5+
function onContextMenu(e) {
6+
//prevent the browser's default menu
7+
e.preventDefault();
8+
//show your menu
9+
ContextMenuGlobal.showContextMenu({
10+
x: e.x,
11+
y: e.y,
12+
items: [
13+
{
14+
label: "A menu item",
15+
onClick: () => {
16+
onMenuClick("You click a menu item");
17+
}
18+
},
19+
{
20+
label: "A submenu",
21+
children: [
22+
{ label: "Item1" },
23+
{ label: "Item2" },
24+
{ label: "Item3" },
25+
]
26+
},
27+
]
28+
});
29+
}
30+
function onMenuClick(n) {
31+
alert("You click a menu item" + n);
32+
}
33+
34+
const optionsComponent = ref({
35+
zIndex: 3,
36+
minWidth: 230,
37+
x: 500,
38+
y: 200
39+
});
40+
const show = ref(false);
41+
42+
function onContextMenu2(e) {
43+
//prevent the browser's default menu
44+
e.preventDefault();
45+
//显示组件菜单
46+
show.value = true;
47+
optionsComponent.value.x = e.x;
48+
optionsComponent.value.y = e.y;
49+
}
50+
</script>
51+
52+
<template>
53+
<button @contextmenu="onContextMenu">Right click me to show context menu!</button>
54+
<button @contextmenu="onContextMenu2">Right click me to show context menu!</button>
55+
<context-menu
56+
v-model:show="show"
57+
:options="optionsComponent"
58+
>
59+
<context-menu-item label="Simple item" @click="onMenuClick(1)" />
60+
<context-menu-sperator /><!--use this to add sperator-->
61+
<context-menu-group label="Menu with child">
62+
<context-menu-item label="Item1" @click="onMenuClick(2)" />
63+
<context-menu-item label="Item2" @click="onMenuClick(3)" />
64+
<context-menu-group label="Child with v-for 50">
65+
<context-menu-item v-for="index of 50" :key="index" :label="'Item3-'+index" @click="onMenuClick(index)" />
66+
</context-menu-group>
67+
</context-menu-group>
68+
</context-menu>
69+
</template>

‎parcel-project/index.html

+10
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
<html>
2+
<head>
3+
<meta charset="utf-8">
4+
<title>test</title>
5+
</head>
6+
<body>
7+
<div id="app" />
8+
<script type="module" src="./index.js"></script>
9+
</body>
10+
</html>

‎parcel-project/index.js

+6
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
import '@imengyu/vue3-context-menu/lib/vue3-context-menu.css'
2+
import ContextMenu from '@imengyu/vue3-context-menu'
3+
import App from './App.vue'
4+
import { createApp } from 'vue'
5+
6+
createApp(App).use(ContextMenu).mount('#app')

‎parcel-project/minimal-parcel-project.zip

39.3 KB
Binary file not shown.

0 commit comments

Comments
 (0)