menu-item.js 3.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105
  1. 'use strict';
  2. Object.defineProperty(exports, '__esModule', { value: true });
  3. var vue = require('vue');
  4. var index$1 = require('../../tooltip/index.js');
  5. var useMenu = require('./use-menu.js');
  6. var menuItem = require('./menu-item2.js');
  7. var pluginVue_exportHelper = require('../../../_virtual/plugin-vue_export-helper.js');
  8. var index = require('../../../hooks/use-namespace/index.js');
  9. var error = require('../../../utils/error.js');
  10. const COMPONENT_NAME = "ElMenuItem";
  11. const __default__ = vue.defineComponent({
  12. name: COMPONENT_NAME
  13. });
  14. const _sfc_main = /* @__PURE__ */ vue.defineComponent({
  15. ...__default__,
  16. props: menuItem.menuItemProps,
  17. emits: menuItem.menuItemEmits,
  18. setup(__props, { expose, emit }) {
  19. const props = __props;
  20. const instance = vue.getCurrentInstance();
  21. const rootMenu = vue.inject("rootMenu");
  22. const nsMenu = index.useNamespace("menu");
  23. const nsMenuItem = index.useNamespace("menu-item");
  24. if (!rootMenu)
  25. error.throwError(COMPONENT_NAME, "can not inject root menu");
  26. const { parentMenu, indexPath } = useMenu["default"](instance, vue.toRef(props, "index"));
  27. const subMenu = vue.inject(`subMenu:${parentMenu.value.uid}`);
  28. if (!subMenu)
  29. error.throwError(COMPONENT_NAME, "can not inject sub menu");
  30. const active = vue.computed(() => props.index === rootMenu.activeIndex);
  31. const item = vue.reactive({
  32. index: props.index,
  33. indexPath,
  34. active
  35. });
  36. const handleClick = () => {
  37. if (!props.disabled) {
  38. rootMenu.handleMenuItemClick({
  39. index: props.index,
  40. indexPath: indexPath.value,
  41. route: props.route
  42. });
  43. emit("click", item);
  44. }
  45. };
  46. vue.onMounted(() => {
  47. subMenu.addSubMenu(item);
  48. rootMenu.addMenuItem(item);
  49. });
  50. vue.onBeforeUnmount(() => {
  51. subMenu.removeSubMenu(item);
  52. rootMenu.removeMenuItem(item);
  53. });
  54. expose({
  55. parentMenu,
  56. rootMenu,
  57. active,
  58. nsMenu,
  59. nsMenuItem,
  60. handleClick
  61. });
  62. return (_ctx, _cache) => {
  63. return vue.openBlock(), vue.createElementBlock("li", {
  64. class: vue.normalizeClass([
  65. vue.unref(nsMenuItem).b(),
  66. vue.unref(nsMenuItem).is("active", vue.unref(active)),
  67. vue.unref(nsMenuItem).is("disabled", _ctx.disabled)
  68. ]),
  69. role: "menuitem",
  70. tabindex: "-1",
  71. onClick: handleClick
  72. }, [
  73. vue.unref(parentMenu).type.name === "ElMenu" && vue.unref(rootMenu).props.collapse && _ctx.$slots.title ? (vue.openBlock(), vue.createBlock(vue.unref(index$1.ElTooltip), {
  74. key: 0,
  75. effect: vue.unref(rootMenu).props.popperEffect,
  76. placement: "right",
  77. "fallback-placements": ["left"],
  78. persistent: vue.unref(rootMenu).props.persistent
  79. }, {
  80. content: vue.withCtx(() => [
  81. vue.renderSlot(_ctx.$slots, "title")
  82. ]),
  83. default: vue.withCtx(() => [
  84. vue.createElementVNode("div", {
  85. class: vue.normalizeClass(vue.unref(nsMenu).be("tooltip", "trigger"))
  86. }, [
  87. vue.renderSlot(_ctx.$slots, "default")
  88. ], 2)
  89. ]),
  90. _: 3
  91. }, 8, ["effect", "persistent"])) : (vue.openBlock(), vue.createElementBlock(vue.Fragment, { key: 1 }, [
  92. vue.renderSlot(_ctx.$slots, "default"),
  93. vue.renderSlot(_ctx.$slots, "title")
  94. ], 64))
  95. ], 2);
  96. };
  97. }
  98. });
  99. var MenuItem = /* @__PURE__ */ pluginVue_exportHelper["default"](_sfc_main, [["__file", "menu-item.vue"]]);
  100. exports["default"] = MenuItem;
  101. //# sourceMappingURL=menu-item.js.map