AnchorLink.js 2.7 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980
  1. import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
  2. import { createVNode as _createVNode } from "vue";
  3. import { defineComponent, nextTick, onBeforeUnmount, onMounted, watch } from 'vue';
  4. import PropTypes from '../_util/vue-types';
  5. import { getPropsSlot, initDefaultProps } from '../_util/props-util';
  6. import classNames from '../_util/classNames';
  7. import useConfigInject from '../_util/hooks/useConfigInject';
  8. import { useInjectAnchor } from './context';
  9. export var anchorLinkProps = function anchorLinkProps() {
  10. return {
  11. prefixCls: String,
  12. href: String,
  13. title: PropTypes.any,
  14. target: String
  15. };
  16. };
  17. export default defineComponent({
  18. compatConfig: {
  19. MODE: 3
  20. },
  21. name: 'AAnchorLink',
  22. props: initDefaultProps(anchorLinkProps(), {
  23. href: '#'
  24. }),
  25. slots: ['title'],
  26. setup: function setup(props, _ref) {
  27. var slots = _ref.slots;
  28. var mergedTitle = null;
  29. var _useInjectAnchor = useInjectAnchor(),
  30. contextHandleClick = _useInjectAnchor.handleClick,
  31. scrollTo = _useInjectAnchor.scrollTo,
  32. unregisterLink = _useInjectAnchor.unregisterLink,
  33. registerLink = _useInjectAnchor.registerLink,
  34. activeLink = _useInjectAnchor.activeLink;
  35. var _useConfigInject = useConfigInject('anchor', props),
  36. prefixCls = _useConfigInject.prefixCls;
  37. var handleClick = function handleClick(e) {
  38. var href = props.href;
  39. contextHandleClick(e, {
  40. title: mergedTitle,
  41. href: href
  42. });
  43. scrollTo(href);
  44. };
  45. watch(function () {
  46. return props.href;
  47. }, function (val, oldVal) {
  48. nextTick(function () {
  49. unregisterLink(oldVal);
  50. registerLink(val);
  51. });
  52. });
  53. onMounted(function () {
  54. registerLink(props.href);
  55. });
  56. onBeforeUnmount(function () {
  57. unregisterLink(props.href);
  58. });
  59. return function () {
  60. var _slots$default;
  61. var href = props.href,
  62. target = props.target;
  63. var pre = prefixCls.value;
  64. var title = getPropsSlot(slots, props, 'title');
  65. mergedTitle = title;
  66. var active = activeLink.value === href;
  67. var wrapperClassName = classNames("".concat(pre, "-link"), _defineProperty({}, "".concat(pre, "-link-active"), active));
  68. var titleClassName = classNames("".concat(pre, "-link-title"), _defineProperty({}, "".concat(pre, "-link-title-active"), active));
  69. return _createVNode("div", {
  70. "class": wrapperClassName
  71. }, [_createVNode("a", {
  72. "class": titleClassName,
  73. "href": href,
  74. "title": typeof title === 'string' ? title : '',
  75. "target": target,
  76. "onClick": handleClick
  77. }, [title]), (_slots$default = slots.default) === null || _slots$default === void 0 ? void 0 : _slots$default.call(slots)]);
  78. };
  79. }
  80. });