mirror of
https://gitee.com/vant-contrib/vant.git
synced 2025-04-06 03:57:59 +08:00
[new feature] optimize clickoutside (#324)
* fix: Tabbar icon line-height * [new feature] progress add showPivot prop * [new feature] TabItem support vue-router * [new feature] update document header style * [Doc] add toast english ducoment * [bugfix] Search box-sizing wrong * [Doc] update vant-demo respo * [Doc] translate theme & demo pages * [Doc] add Internationalization document * [bugfix] remove unnecessary props * [fix] optimize clickoutside
This commit is contained in:
parent
ffa3fddfae
commit
cd0a0bc8f9
@ -1,38 +1,39 @@
|
|||||||
/**
|
/**
|
||||||
* v-clickoutside
|
* v-clickoutside
|
||||||
* @desc 点击元素外面才会触发的事件
|
*
|
||||||
* @example
|
|
||||||
* ```vue
|
* ```vue
|
||||||
* <div v-clickoutside="handleClose">
|
* <div v-clickoutside="onClose">
|
||||||
* ```
|
* ```
|
||||||
*/
|
*/
|
||||||
|
|
||||||
import Vue from 'vue';
|
import Vue from 'vue';
|
||||||
|
|
||||||
const isServer = Vue.prototype.$isServer;
|
const isServer = Vue.prototype.$isServer;
|
||||||
const clickoutsideContext = '@@clickoutsideContext';
|
const context = '@@clickoutsideContext';
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
bind(el, binding, vnode) {
|
bind(el, binding) {
|
||||||
const documentHandler = function(e) {
|
const handler = event => {
|
||||||
if (vnode.context && !el.contains(e.target)) {
|
if (!el.contains(event.target)) {
|
||||||
vnode.context[el[clickoutsideContext].methodName]();
|
el[context].callback();
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
el[clickoutsideContext] = {
|
|
||||||
documentHandler,
|
el[context] = {
|
||||||
methodName: binding.expression,
|
handler,
|
||||||
|
callback: binding.value,
|
||||||
arg: binding.arg || 'click'
|
arg: binding.arg || 'click'
|
||||||
};
|
};
|
||||||
!isServer && document.addEventListener(el[clickoutsideContext].arg, documentHandler);
|
|
||||||
|
!isServer && document.addEventListener(el[context].arg, handler);
|
||||||
},
|
},
|
||||||
|
|
||||||
update(el, binding) {
|
update(el, binding) {
|
||||||
el[clickoutsideContext].methodName = binding.expression;
|
el[context].callback = binding.value;
|
||||||
},
|
},
|
||||||
|
|
||||||
unbind(el) {
|
unbind(el) {
|
||||||
!isServer && document.removeEventListener(
|
!isServer && document.removeEventListener(el[context].arg, el[context].handler);
|
||||||
el[clickoutsideContext].arg,
|
|
||||||
el[clickoutsideContext].documentHandler);
|
|
||||||
},
|
},
|
||||||
|
|
||||||
install(Vue) {
|
install(Vue) {
|
||||||
|
Loading…
x
Reference in New Issue
Block a user