MenuItem.js 2.1 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677
  1. import _mergeJSXProps from 'babel-helper-vue-jsx-merge-props';
  2. import _extends from 'babel-runtime/helpers/extends';
  3. import { Item, itemProps } from '../vc-menu';
  4. import { getOptionProps, getListeners } from '../_util/props-util';
  5. import Tooltip from '../tooltip';
  6. function noop() {}
  7. export default {
  8. name: 'MenuItem',
  9. inheritAttrs: false,
  10. props: itemProps,
  11. inject: {
  12. getInlineCollapsed: { 'default': function _default() {
  13. return noop;
  14. } },
  15. layoutSiderContext: { 'default': function _default() {
  16. return {};
  17. } }
  18. },
  19. isMenuItem: true,
  20. methods: {
  21. onKeyDown: function onKeyDown(e) {
  22. this.$refs.menuItem.onKeyDown(e);
  23. }
  24. },
  25. render: function render() {
  26. var h = arguments[0];
  27. var props = getOptionProps(this);
  28. var level = props.level,
  29. title = props.title,
  30. rootPrefixCls = props.rootPrefixCls;
  31. var getInlineCollapsed = this.getInlineCollapsed,
  32. $slots = this.$slots,
  33. attrs = this.$attrs;
  34. var inlineCollapsed = getInlineCollapsed();
  35. var tooltipTitle = title;
  36. if (typeof title === 'undefined') {
  37. tooltipTitle = level === 1 ? $slots['default'] : '';
  38. } else if (title === false) {
  39. tooltipTitle = '';
  40. }
  41. var tooltipProps = {
  42. title: tooltipTitle
  43. };
  44. var siderCollapsed = this.layoutSiderContext.sCollapsed;
  45. if (!siderCollapsed && !inlineCollapsed) {
  46. tooltipProps.title = null;
  47. // Reset `visible` to fix control mode tooltip display not correct
  48. // ref: https://github.com/ant-design/ant-design/issues/16742
  49. tooltipProps.visible = false;
  50. }
  51. var itemProps = {
  52. props: _extends({}, props, {
  53. title: title
  54. }),
  55. attrs: attrs,
  56. on: getListeners(this)
  57. };
  58. var toolTipProps = {
  59. props: _extends({}, tooltipProps, {
  60. placement: 'right',
  61. overlayClassName: rootPrefixCls + '-inline-collapsed-tooltip'
  62. })
  63. };
  64. return h(
  65. Tooltip,
  66. toolTipProps,
  67. [h(
  68. Item,
  69. _mergeJSXProps([itemProps, { ref: 'menuItem' }]),
  70. [$slots['default']]
  71. )]
  72. );
  73. }
  74. };