Press n or j to go to the next uncovered block, b, p or k for the previous block.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 | 7x 7x 7x | <template> <span :class="$style.root" :type="type"> <u-tooltip :content="content" :opened="opened" :trigger="trigger" :placement="placement" :reference="reference" :hide-delay="hideDelay" :boundaries-element="boundariesElement" :follow-cursor="followCursor" :offset="offset" :disabled="disabled" :size="size" v-on="$listeners"> <slot></slot> </u-tooltip> </span> </template> <script> import MPopper from '../m-popper.vue'; import pick from 'lodash/pick'; /** * 默认显示一个按钮,hover 上去有提示 */ export default { name: 'u-icon-tooltip', props: { type: { type: String, default: 'info' }, // 按钮名称 size: { type: String, default: 'normal' }, // 提示大小 content: String, trigger: { type: String, default: 'hover' }, placement: { type: String, default: 'bottom' }, ...pick(MPopper.props, [ 'opened', 'reference', 'hideDelay', 'boundariesElement', 'followCursor', 'offset', 'disabled', ]), }, }; </script> <style module> .root { display: inline-block; line-height: 1; color: var(--icon-tooltip-color); } .root:hover { color: var(--brand-primary); } .root::before { icon-font: url('./assets/info.svg'); } .root[type="help"]::before { icon-font: url('./assets/help.svg'); } .root[type="detail"]::before { icon-font: url('./assets/detail.svg'); } </style> |