clickoutside.js 2.3 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879
  1. 'use strict';
  2. exports.__esModule = true;
  3. var _vue = require('vue');
  4. var _vue2 = _interopRequireDefault(_vue);
  5. var _dom = require('element-ui/lib/utils/dom');
  6. function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
  7. var nodeList = [];
  8. var ctx = '@@clickoutsideContext';
  9. var startClick = void 0;
  10. var seed = 0;
  11. !_vue2.default.prototype.$isServer && (0, _dom.on)(document, 'mousedown', function (e) {
  12. return startClick = e;
  13. });
  14. !_vue2.default.prototype.$isServer && (0, _dom.on)(document, 'mouseup', function (e) {
  15. nodeList.forEach(function (node) {
  16. return node[ctx].documentHandler(e, startClick);
  17. });
  18. });
  19. function createDocumentHandler(el, binding, vnode) {
  20. return function () {
  21. var mouseup = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
  22. var mousedown = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
  23. if (!vnode || !vnode.context || !mouseup.target || !mousedown.target || el.contains(mouseup.target) || el.contains(mousedown.target) || el === mouseup.target || vnode.context.popperElm && (vnode.context.popperElm.contains(mouseup.target) || vnode.context.popperElm.contains(mousedown.target))) return;
  24. if (binding.expression && el[ctx].methodName && vnode.context[el[ctx].methodName]) {
  25. vnode.context[el[ctx].methodName]();
  26. } else {
  27. el[ctx].bindingFn && el[ctx].bindingFn();
  28. }
  29. };
  30. }
  31. /**
  32. * v-clickoutside
  33. * @desc 点击元素外面才会触发的事件
  34. * @example
  35. * ```vue
  36. * <div v-element-clickoutside="handleClose">
  37. * ```
  38. */
  39. exports.default = {
  40. bind: function bind(el, binding, vnode) {
  41. nodeList.push(el);
  42. var id = seed++;
  43. el[ctx] = {
  44. id: id,
  45. documentHandler: createDocumentHandler(el, binding, vnode),
  46. methodName: binding.expression,
  47. bindingFn: binding.value
  48. };
  49. },
  50. update: function update(el, binding, vnode) {
  51. el[ctx].documentHandler = createDocumentHandler(el, binding, vnode);
  52. el[ctx].methodName = binding.expression;
  53. el[ctx].bindingFn = binding.value;
  54. },
  55. unbind: function unbind(el) {
  56. var len = nodeList.length;
  57. for (var i = 0; i < len; i++) {
  58. if (nodeList[i][ctx].id === el[ctx].id) {
  59. nodeList.splice(i, 1);
  60. break;
  61. }
  62. }
  63. delete el[ctx];
  64. }
  65. };