Tooltip.js 4.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114
  1. import _extends from 'babel-runtime/helpers/extends';
  2. import _objectWithoutProperties from 'babel-runtime/helpers/objectWithoutProperties';
  3. import PropTypes from '../_util/vue-types';
  4. import Trigger from '../vc-trigger';
  5. import { placements } from './placements';
  6. import Content from './Content';
  7. import { hasProp, getComponentFromProp, getOptionProps, getListeners } from '../_util/props-util';
  8. function noop() {}
  9. export default {
  10. props: {
  11. trigger: PropTypes.any.def(['hover']),
  12. defaultVisible: PropTypes.bool,
  13. visible: PropTypes.bool,
  14. placement: PropTypes.string.def('right'),
  15. transitionName: PropTypes.oneOfType([PropTypes.string, PropTypes.object]),
  16. animation: PropTypes.any,
  17. afterVisibleChange: PropTypes.func.def(function () {}),
  18. overlay: PropTypes.any,
  19. overlayStyle: PropTypes.object,
  20. overlayClassName: PropTypes.string,
  21. prefixCls: PropTypes.string.def('rc-tooltip'),
  22. mouseEnterDelay: PropTypes.number.def(0),
  23. mouseLeaveDelay: PropTypes.number.def(0.1),
  24. getTooltipContainer: PropTypes.func,
  25. destroyTooltipOnHide: PropTypes.bool.def(false),
  26. align: PropTypes.object.def(function () {
  27. return {};
  28. }),
  29. arrowContent: PropTypes.any.def(null),
  30. tipId: PropTypes.string,
  31. builtinPlacements: PropTypes.object
  32. },
  33. methods: {
  34. getPopupElement: function getPopupElement() {
  35. var h = this.$createElement;
  36. var _$props = this.$props,
  37. prefixCls = _$props.prefixCls,
  38. tipId = _$props.tipId;
  39. return [h(
  40. 'div',
  41. { 'class': prefixCls + '-arrow', key: 'arrow' },
  42. [getComponentFromProp(this, 'arrowContent')]
  43. ), h(Content, {
  44. key: 'content',
  45. attrs: { trigger: this.$refs.trigger,
  46. prefixCls: prefixCls,
  47. id: tipId,
  48. overlay: getComponentFromProp(this, 'overlay')
  49. }
  50. })];
  51. },
  52. getPopupDomNode: function getPopupDomNode() {
  53. return this.$refs.trigger.getPopupDomNode();
  54. }
  55. },
  56. render: function render(h) {
  57. var _getOptionProps = getOptionProps(this),
  58. overlayClassName = _getOptionProps.overlayClassName,
  59. trigger = _getOptionProps.trigger,
  60. mouseEnterDelay = _getOptionProps.mouseEnterDelay,
  61. mouseLeaveDelay = _getOptionProps.mouseLeaveDelay,
  62. overlayStyle = _getOptionProps.overlayStyle,
  63. prefixCls = _getOptionProps.prefixCls,
  64. afterVisibleChange = _getOptionProps.afterVisibleChange,
  65. transitionName = _getOptionProps.transitionName,
  66. animation = _getOptionProps.animation,
  67. placement = _getOptionProps.placement,
  68. align = _getOptionProps.align,
  69. destroyTooltipOnHide = _getOptionProps.destroyTooltipOnHide,
  70. defaultVisible = _getOptionProps.defaultVisible,
  71. getTooltipContainer = _getOptionProps.getTooltipContainer,
  72. restProps = _objectWithoutProperties(_getOptionProps, ['overlayClassName', 'trigger', 'mouseEnterDelay', 'mouseLeaveDelay', 'overlayStyle', 'prefixCls', 'afterVisibleChange', 'transitionName', 'animation', 'placement', 'align', 'destroyTooltipOnHide', 'defaultVisible', 'getTooltipContainer']);
  73. var extraProps = _extends({}, restProps);
  74. if (hasProp(this, 'visible')) {
  75. extraProps.popupVisible = this.$props.visible;
  76. }
  77. var listeners = getListeners(this);
  78. var triggerProps = {
  79. props: _extends({
  80. popupClassName: overlayClassName,
  81. prefixCls: prefixCls,
  82. action: trigger,
  83. builtinPlacements: placements,
  84. popupPlacement: placement,
  85. popupAlign: align,
  86. getPopupContainer: getTooltipContainer,
  87. afterPopupVisibleChange: afterVisibleChange,
  88. popupTransitionName: transitionName,
  89. popupAnimation: animation,
  90. defaultPopupVisible: defaultVisible,
  91. destroyPopupOnHide: destroyTooltipOnHide,
  92. mouseLeaveDelay: mouseLeaveDelay,
  93. popupStyle: overlayStyle,
  94. mouseEnterDelay: mouseEnterDelay
  95. }, extraProps),
  96. on: _extends({}, listeners, {
  97. popupVisibleChange: listeners.visibleChange || noop,
  98. popupAlign: listeners.popupAlign || noop
  99. }),
  100. ref: 'trigger'
  101. };
  102. return h(
  103. Trigger,
  104. triggerProps,
  105. [h(
  106. 'template',
  107. { slot: 'popup' },
  108. [this.getPopupElement(h)]
  109. ), this.$slots['default']]
  110. );
  111. }
  112. };