mirrors/vue-context
2
0
Fork 0
mirror of https://github.com/tenrok/vue-context.git synced 2026-06-23 14:20:33 +03:00
Code Activity

3.4 updates (#16)

Browse Source
This commit is contained in:
Randall Wilk
2019-04-03 20:26:45 -05:00
committed by GitHub
parent 924203f4f2
commit 9d5c9da356
12 changed files with 3839 additions and 4904 deletions
Download Patch File Download Diff File Expand all files Collapse all files
CHANGELOG.md
+11
View File
@@ -2,6 +2,17 @@
All notable changes to this project will be documented here. All notable changes to this project will be documented here.
<a name="3.4.1"></a>
## [3.4.1](https://github.com/rawilk/vue-context/releases/tag/3.4.1)
Released 2019-04-03
### Updates 3.4.1
- **Scroll Listener:** Only attach the close scroll event listener when opened and immediately remove it when menu is closed
to prevent it being called unnecessarily.
- **Dependencies:** Removed Vue as a dependency as it never really was one since v3.0.0.
- **Dependencies:** Ran `npm audit fix` to fix vulnerabilities found from dependencies.
<a name="3.4.0"></a> <a name="3.4.0"></a>
## [3.4.0](https://github.com/rawilk/vue-context/releases/tag/3.4.0) ## [3.4.0](https://github.com/rawilk/vue-context/releases/tag/3.4.0)
README.md
+2 -2
View File
@@ -7,8 +7,8 @@
[![VueJS version](https://img.shields.io/badge/vue.js-2.x-green.svg?style=for-the-badge)](https://vuejs.org) [![VueJS version](https://img.shields.io/badge/vue.js-2.x-green.svg?style=for-the-badge)](https://vuejs.org)
`vue-context` provides a simple yet flexible context menu for Vue. It is styled for the standard `<ul>` tag, but any menu template can be used. `vue-context` provides a simple yet flexible context menu for Vue. It is styled for the standard `<ul>` tag, but any menu template can be used.
The only dependencies the menu has are Vue and vue-clickaway, so the majority of styling is up to you, and any of the package The menu is lightweight with its only dependency being `vue-clickaway`. The menu has some basic styles applied to it but they can be easily
styles for the menu can easily be overridden. overridden by your own styles.
<br><br> <br><br>
The menu disappears when you expect by utilizing `vue-clickaway` and it also optionally disappears when clicked on. The menu disappears when you expect by utilizing `vue-clickaway` and it also optionally disappears when clicked on.
build/webpack-test.mix.js
+1 -2
View File
@@ -1,7 +1,6 @@
const { mix } = require('laravel-mix'); const mix = require('laravel-mix');
mix mix
.setPublicPath('test/js/dist') .setPublicPath('test/js/dist')
.js('test/js/src/index.js', 'index.js') .js('test/js/src/index.js', 'index.js')
.js('test/js/src/test_issue_4.js', 'test_issue_4.js')
.sourceMaps(); .sourceMaps();
build/webpack.mix.js
+1 -1
View File
@@ -1,4 +1,4 @@
const { mix } = require('laravel-mix'); const mix = require('laravel-mix');
const inProduction = mix.inProduction(); const inProduction = mix.inProduction();
dist/vue-context.js
Vendored
+1 -1
View File
File diff suppressed because one or more lines are too long
package-lock.json
Generated
+3694 -4642
View File
File diff suppressed because it is too large Load Diff
package.json
+6 -4
View File
@@ -26,13 +26,15 @@
}, },
"homepage": "https://github.com/rawilk/vue-context#readme", "homepage": "https://github.com/rawilk/vue-context#readme",
"dependencies": { "dependencies": {
"vue": "^2.5.17",
"vue-clickaway": "^2.2.2" "vue-clickaway": "^2.2.2"
}, },
"devDependencies": { "devDependencies": {
"babel-preset-env": "^1.7.0", "@babel/preset-env": "^7.4.3",
"cross-env": "^5.2.0", "cross-env": "^5.2.0",
"laravel-mix": "^2.1.14", "laravel-mix": "^4.0.15",
"node-sass": "^4.9.4" "node-sass": "^4.11.0",
"sass-loader": "^7.1.0",
"vue": "^2.6.10",
"vue-template-compiler": "^2.6.10"
} }
} }
src/vue-context.vue
+8 -6
View File
@@ -61,12 +61,6 @@
}; };
}, },
mounted () {
if (this.closeOnScroll) {
this.addScrollEventListener();
}
},
beforeDestroy () { beforeDestroy () {
if (this.closeOnScroll) { if (this.closeOnScroll) {
this.removeScrollEventListener(); this.removeScrollEventListener();
@@ -96,6 +90,10 @@
this.data = null; this.data = null;
this.show = false; this.show = false;
if (this.closeOnScroll) {
this.removeScrollEventListener();
}
if (emit) { if (emit) {
this.$emit('close'); this.$emit('close');
} }
@@ -124,6 +122,10 @@
this.positionMenu(event.clientY, event.clientX); this.positionMenu(event.clientY, event.clientX);
this.$el.focus(); this.$el.focus();
if (this.closeOnScroll) {
this.addScrollEventListener();
}
this.$emit('open', event, this.data, this.top, this.left); this.$emit('open', event, this.data, this.top, this.left);
}); });
}, },
test/js/dist/index.js
Vendored
+115 -37
View File
File diff suppressed because one or more lines are too long
test/js/dist/test_issue_4.js
Vendored
-126
View File
File diff suppressed because one or more lines are too long
test/js/src/test_issue_4.js
-24
View File
@@ -1,24 +0,0 @@
import Vue from 'vue';
import { VueContext } from '../../../dist/vue-context';
new Vue({
components: {
VueContext
},
data: {
items: []
},
mounted () {
for (let i = 0; i < 30; i++) {
this.items.push(`Row ${i + 1}`);
}
},
methods: {
onClick (data) {
alert(data);
},
},
}).$mount('#app');
test/test_issue_4.html
-59
View File
@@ -1,59 +0,0 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Vue Context Issue Test #4</title>
<style>
#div1 {
height: 50px;
background: #ff0000;
position: -webkit-sticky;
position: sticky;
top: 0;
z-index: 1020;
}
#div2 {
height: calc(100vh - 50px);
}
#div2 table {
height: 100%;
width: 100%;
border-collapse: collapse;
}
#div2 table td {
border: 1px solid #ddd;
padding: 0;
line-height: 1;
}
</style>
</head>
<body>
<div id="app">
<div id="div1">
&nbsp;
</div>
<div id="div2">
<table>
<tbody>
<tr v-for="item in items" @contextmenu.prevent="$refs.menu.open($event, item)">
<td v-text="item"></td>
</tr>
</tbody>
</table>
</div>
<vue-context ref="menu">
<ul slot-scope="child" v-if="child.data">
<li @click="onClick(child.data)">Do something with: {{ child.data }}</li>
</ul>
</vue-context>
</div>
<script src="js/dist/test_issue_4.js"></script>
</body>
</html>