diff --git a/src/popup/_example/plugin.vue b/src/popup/_example/plugin.vue new file mode 100644 index 000000000..d035238ac --- /dev/null +++ b/src/popup/_example/plugin.vue @@ -0,0 +1,28 @@ + + + diff --git a/src/popup/index.ts b/src/popup/index.ts index 39f9254ba..8317c7436 100644 --- a/src/popup/index.ts +++ b/src/popup/index.ts @@ -7,10 +7,10 @@ import './style'; export type PopupProps = TdPopupProps; export * from './type'; +export * from './plugin'; -export const Popup = withInstall(mapProps( - ['visible'], - { model: { prop: 'visible', event: 'visible-change' } }, -)(_Popup)); +export const Popup = withInstall( + mapProps(['visible'], { model: { prop: 'visible', event: 'visible-change' } })(_Popup), +); export default Popup; diff --git a/src/popup/plugin.tsx b/src/popup/plugin.tsx new file mode 100644 index 000000000..bb950fc9d --- /dev/null +++ b/src/popup/plugin.tsx @@ -0,0 +1,210 @@ +import Vue, { VNode } from 'vue'; +import { createPopper, Instance } from '@popperjs/core'; +import { + getAttach, once, on, off, +} from '../utils/dom'; +import props from './props'; +import { getClassPrefixMixins } from '../config-provider/config-receiver'; +import { renderTNodeJSX } from '../utils/render-tnode'; +import { getPopperPlacement, triggers } from './utils'; +import mixins from '../utils/mixins'; + +import type { TNode, ClassName } from '../common'; +import type { TdPopupProps } from './type'; + +export interface PopupPluginApi { + config: TdPopupProps; +} +const classPrefixMixins = getClassPrefixMixins('popup'); + +let popperInstance: Instance; +let overlayInstance: HTMLElement; +let timeout: NodeJS.Timeout; +let triggerEl: HTMLElement; + +const triggerType = (triggerProps: string): Record<(typeof triggers)[number], boolean> => triggers.reduce( + (map, trigger) => ({ + ...map, + [trigger]: triggerProps.includes(trigger), + }), + {} as any, +); + +const Overlay = mixins(classPrefixMixins).extend({ + name: 'TPopupOverlay', + data() { + return { + visibleState: false, + contentClicked: false, + }; + }, + props: { + ...props, + triggerEl: HTMLElement, + }, + computed: { + hasTrigger(): Record<(typeof triggers)[number], boolean> { + return triggerType(this.trigger); + }, + overlayClasses(): ClassName { + return [ + `${this.componentName}__content`, + { + [`${this.componentName}__content--text`]: this.content === 'string', + [`${this.componentName}__content--arrow`]: this.showArrow, + [this.commonStatusClassName.disabled]: this.disabled, + }, + this.overlayInnerClassName, + ]; + }, + }, + + methods: { + handleDocumentClick(e: Event): void { + if (triggerEl?.contains(e.target as Node)) return; + if (this.contentClicked) { + setTimeout(() => { + this.contentClicked = false; + }); + } else { + if (this.destroyOnClose) { + this.visibleState = false; + } + popperInstance?.destroy(); + popperInstance = null; + triggerEl = null; + } + }, + handleMouseLeave(): void { + if (this.destroyOnClose) { + this.visibleState = false; + } + popperInstance?.destroy(); + popperInstance = null; + }, + handleMouseEnter(): void { + clearTimeout(timeout); + }, + }, + created() { + this.visibleState = true; + }, + mounted() { + setTimeout(() => { + on(document, 'click', this.handleDocumentClick); + }); + }, + beforeDestroy() { + off(document, 'click', this.handleDocumentClick); + }, + render(h): VNode { + const content = renderTNodeJSX(this, 'content'); + + const hidePopup = this.hideEmptyPopup && ['', undefined, null].includes(content); + const { + handleMouseLeave, handleMouseEnter, visibleState, hasTrigger, + } = this; + const renderNode = h( + 'div', + { + class: [this.componentName, this.overlayClassName], + ref: 'popper', + style: [ + hidePopup && { visibility: 'hidden', pointerEvents: 'none' }, + { zIndex: this.zIndex }, + this.overlayStyle, + ], + on: { + mousedown: () => { + this.contentClicked = true; + }, + ...(hasTrigger.hover && { + mouseenter: handleMouseEnter, + mouseleave: handleMouseLeave, + }), + }, + }, + [ + h( + 'div', + { + ref: 'overlay', + class: this.overlayClasses, + style: this.overlayInnerStyle, + }, + [content, this.showArrow && h('div', { class: `${this.componentName}__arrow` })], + ), + ], + ); + return visibleState ? ( + + {renderNode} + + ) : null; + }, +}); + +const removeOverlayInstance = () => { + if (overlayInstance) { + overlayInstance.remove(); + overlayInstance = null; + } + if (popperInstance) { + popperInstance.destroy(); + popperInstance = null; + } +}; + +const triggerPopupPlugin = (trigger: string, content: TNode, popupProps: TdPopupProps) => { + const hasTrigger = triggerType(popupProps.trigger || 'hover'); + const currentTriggerEl = getAttach(trigger); + if (triggerEl && hasTrigger.click) { + return; + } + triggerEl = currentTriggerEl; + removeOverlayInstance(); + + let attach = getAttach(popupProps.attach); + + const delay = [].concat(popupProps.delay ?? [250, 150]); + const closeDelay = delay[1] ?? delay[0]; + if (attach === document.body) { + // don't allow mount on body directly + const popupDom = document.createElement('div'); + document.body.appendChild(popupDom); + attach = popupDom; + } + + overlayInstance = new Overlay({ + propsData: { + ...popupProps, + content, + triggerEl, + }, + }).$mount(attach).$el as HTMLElement; + + if (hasTrigger.hover) { + const mouseoutEvent = () => { + timeout = setTimeout(removeOverlayInstance, closeDelay); + }; + once(triggerEl, 'mouseleave', mouseoutEvent); + } else if (hasTrigger.focus) { + const focusoutEvent = () => { + timeout = setTimeout(removeOverlayInstance, closeDelay); + }; + once(triggerEl, 'focusout', focusoutEvent); + } + + popperInstance = createPopper(triggerEl, overlayInstance, { + placement: getPopperPlacement(popupProps.placement as TdPopupProps['placement']), + ...popupProps.popperOptions, + }); +}; + +Vue.prototype.$popup = triggerPopupPlugin; + +declare module 'vue/types/vue' { + interface Vue { + $popup: PopupPluginApi; + } +} diff --git a/src/popup/popup.en-US.md b/src/popup/popup.en-US.md index 42d9ce5e1..63d6f990e 100644 --- a/src/popup/popup.en-US.md +++ b/src/popup/popup.en-US.md @@ -35,3 +35,13 @@ name | params | description scroll | `(context: { e: WheelEvent })` | \- scroll-to-bottom | `(context: { e: WheelEvent })` | \- visible-change | `(visible: boolean, context: PopupVisibleChangeContext)` | [see more ts definition](https://github.com/Tencent/tdesign-vue/tree/develop/src/popup/type.ts)。
`interface PopupVisibleChangeContext { e?: PopupTriggerEvent; trigger?: PopupTriggerSource }`

`type PopupTriggerEvent = MouseEvent \| FocusEvent \| KeyboardEvent`

`type PopupTriggerSource = 'document' \| 'trigger-element-click' \| 'trigger-element-hover' \| 'trigger-element-blur' \| 'trigger-element-focus' \| 'trigger-element-mousedown' \| 'context-menu' \| 'keydown-esc'`
+ +### PopupPlugin + +support `this.$popup` + +name | params | default | description +-- | -- | -- | -- +content | String / Slot / Function | - | required。Typescript:`string \| TNode`。[see more ts definition](https://github.com/Tencent/tdesign-vue/blob/develop/src/common.ts) +popupProps | Object | - | \- +triggerElement | String | - | required diff --git a/src/popup/popup.md b/src/popup/popup.md index c710eec8c..c00a5678b 100644 --- a/src/popup/popup.md +++ b/src/popup/popup.md @@ -1,5 +1,13 @@ :: BASE_DOC :: +### 通过插件方式调用Popup + +通过插件方式调用Popup,用于将Popup渲染在已有节点的场景,同时该方式不论如何调用都只会挂载在一个节点上,用于减少页面上的Popup的渲染节点。 + +使用方式:`this.$popup(triggerElement, content, popupProps)` + +{{ plugin }} + ## API ### Popup Props @@ -35,3 +43,13 @@ onVisibleChange | Function | | TS 类型:`(visible: boolean, context: PopupVi scroll | `(context: { e: WheelEvent })` | 下拉选项滚动事件 scroll-to-bottom | `(context: { e: WheelEvent })` | 下拉滚动触底事件,常用于滚动到底执行具体业务逻辑 visible-change | `(visible: boolean, context: PopupVisibleChangeContext)` | 当浮层隐藏或显示时触发,`trigger=document` 表示点击非浮层元素触发;`trigger=context-menu` 表示右击触发。[详细类型定义](https://github.com/Tencent/tdesign-vue/tree/develop/src/popup/type.ts)。
`interface PopupVisibleChangeContext { e?: PopupTriggerEvent; trigger?: PopupTriggerSource }`

`type PopupTriggerEvent = MouseEvent \| FocusEvent \| KeyboardEvent`

`type PopupTriggerSource = 'document' \| 'trigger-element-click' \| 'trigger-element-hover' \| 'trigger-element-blur' \| 'trigger-element-focus' \| 'trigger-element-mousedown' \| 'context-menu' \| 'keydown-esc'`
+ +### PopupPlugin + +同时也支持 `this.$popup`。 + +参数名称 | 参数类型 | 参数默认值 | 参数说明 +-- | -- | -- | -- +content | String / Slot / Function | - | 必需。气泡框的内容。TS 类型:`string \| TNode`。[通用类型定义](https://github.com/Tencent/tdesign-vue/blob/develop/src/common.ts) +popupProps | Object | - | 透传气泡框/浮层的属性 +triggerElement | String | - | 必需。触发气泡框/浮层的元素,传入选择器即可 diff --git a/src/popup/popup.tsx b/src/popup/popup.tsx index c3b0a0b7f..5427cadba 100644 --- a/src/popup/popup.tsx +++ b/src/popup/popup.tsx @@ -1,5 +1,5 @@ import { VNodeDirective } from 'vue'; -import { createPopper, Placement } from '@popperjs/core'; +import { createPopper } from '@popperjs/core'; import { on, off, once } from '../utils/dom'; import { renderTNodeJSX, renderContent } from '../utils/render-tnode'; import { getIEVersion } from '../utils/helper'; @@ -10,32 +10,12 @@ import Container from './container'; import { getClassPrefixMixins } from '../config-provider/config-receiver'; import mixins from '../utils/mixins'; import { emitEvent } from '../utils/event'; +import { getPopperPlacement, attachListeners, triggers } from './utils'; const classPrefixMixins = getClassPrefixMixins('popup'); -const triggers = ['click', 'hover', 'focus', 'context-menu'] as const; const injectionKey = '__T_POPUP'; -function getPopperPlacement(placement: TdPopupProps['placement']) { - return placement.replace(/-(left|top)$/, '-start').replace(/-(right|bottom)$/, '-end') as Placement; -} - -function attachListeners(elm: Element) { - const offs: Array<() => void> = []; - return { - add(type: K, listener: (ev: HTMLElementEventMap[K]) => void) { - on(elm, type, listener); - offs.push(() => { - off(elm, type, listener); - }); - }, - clean() { - offs.forEach((handler) => handler?.()); - offs.length = 0; - }, - }; -} - export default mixins(classPrefixMixins).extend({ name: 'TPopup', @@ -88,7 +68,7 @@ export default mixins(classPrefixMixins).extend({ this.overlayInnerClassName, ]; }, - hasTrigger(): Record { + hasTrigger(): Record<(typeof triggers)[number], boolean> { return triggers.reduce( (map, trigger) => ({ ...map, @@ -201,7 +181,6 @@ export default mixins(classPrefixMixins).extend({ this.popper.update(); return; } - this.popper = createPopper(triggerEl, popperEl, { modifiers: getIEVersion() > 9 @@ -380,7 +359,6 @@ export default mixins(classPrefixMixins).extend({ const ref = renderContent(this, 'default', 'triggerElement'); const content = renderTNodeJSX(this, 'content'); const hidePopup = this.hideEmptyPopup && ['', undefined, null].includes(content); - const overlay = visible || !destroyOnClose ? h( 'div', @@ -429,7 +407,6 @@ export default mixins(classPrefixMixins).extend({ ], ) : null; - return ( , default: 'top', }, /** popper 初始化配置,详情参考 https://popper.js.org/docs/ */ diff --git a/src/popup/type.ts b/src/popup/type.ts index 75050ddab..5b883a175 100644 --- a/src/popup/type.ts +++ b/src/popup/type.ts @@ -6,6 +6,8 @@ import { TNode, ClassName, Styles, AttachNode } from '../common'; +export type PopupMethod = (triggerElement: string, content: string | TNode, popupProps?: object) => void; + export interface TdPopupProps { /** * 制定挂载节点。数据类型为 String 时,会被当作选择器处理,进行节点查询。示例:'body' 或 () => document.body diff --git a/src/popup/utils.ts b/src/popup/utils.ts new file mode 100644 index 000000000..d9ee1d2b8 --- /dev/null +++ b/src/popup/utils.ts @@ -0,0 +1,27 @@ +import { Placement } from '@popperjs/core'; +import { TdPopupProps } from './type'; +import { on, off } from '../utils/dom'; + +const triggers = ['click', 'hover', 'focus', 'context-menu'] as const; + +function getPopperPlacement(placement: TdPopupProps['placement']) { + return placement.replace(/-(left|top)$/, '-start').replace(/-(right|bottom)$/, '-end') as Placement; +} + +function attachListeners(elm: Element) { + const offs: Array<() => void> = []; + return { + add(type: K, listener: (ev: HTMLElementEventMap[K]) => void) { + on(elm, type, listener); + offs.push(() => { + off(elm, type, listener); + }); + }, + clean() { + offs.forEach((handler) => handler?.()); + offs.length = 0; + }, + }; +} + +export { getPopperPlacement, attachListeners, triggers }; diff --git a/test/snap/__snapshots__/csr.test.js.snap b/test/snap/__snapshots__/csr.test.js.snap index 4ee07c50f..1bafc545b 100644 --- a/test/snap/__snapshots__/csr.test.js.snap +++ b/test/snap/__snapshots__/csr.test.js.snap @@ -34003,7 +34003,7 @@ exports[`csr snapshot test > csr test ./src/config-provider/_example/dialog.vue + +
+ +
+ +`; + exports[`csr snapshot test > csr test ./src/popup/_example/style.vue 1`] = `
csr test ./src/textarea/_example/maxlength.vue 1`] placeholder="请输入描述文案,文本长度最多20,maxlength=20" unselectable="off" /> - - 0/20 - +
+ 这里可以放一些提示文字 +
+ + 0/20 + +
csr test ./src/textarea/_example/maxlength.vue 1`] placeholder="请输入描述文案,最多20字符(一个汉字占两个字符长度),maxcharacter=20" unselectable="off" /> - - 0/20 - + + 0/20 + +
@@ -133621,9 +133646,13 @@ exports[`csr snapshot test > csr test ./src/textarea/_example/type.vue 1`] = ` unselectable="off" />
- 这是普通文本提示 +
+ 这是普通文本提示 +
@@ -133638,9 +133667,13 @@ exports[`csr snapshot test > csr test ./src/textarea/_example/type.vue 1`] = ` unselectable="off" />
- 校验通过文本提示 +
+ 校验通过文本提示 +
@@ -133655,9 +133688,13 @@ exports[`csr snapshot test > csr test ./src/textarea/_example/type.vue 1`] = ` unselectable="off" />
- 校验不通过文本提示 +
+ 校验不通过文本提示 +
@@ -133672,122 +133709,12 @@ exports[`csr snapshot test > csr test ./src/textarea/_example/type.vue 1`] = ` unselectable="off" />
- 校验存在严重问题文本提示 -
- - - -`; - -exports[`csr snapshot test > csr test ./src/time-picker/_example/base.vue 1`] = ` -
-
-
-
-
-
- - - - - - - -
-
-
-
-
-
-
-
-
-
-
- - - - - - - -
+ 校验存在严重问题文本提示
@@ -133795,18 +133722,11 @@ exports[`csr snapshot test > csr test ./src/time-picker/_example/base.vue 1`] =
`; -exports[`csr snapshot test > csr test ./src/time-picker/_example/clearable.vue 1`] = ` +exports[`csr snapshot test > csr test ./src/time-picker/_example/base.vue 1`] = `
-
-

- 具备清空按钮 -

-
@@ -133860,13 +133780,6 @@ exports[`csr snapshot test > csr test ./src/time-picker/_example/clearable.vue 1
-
-

- 禁止清空按钮 -

-
@@ -133923,188 +133836,7 @@ exports[`csr snapshot test > csr test ./src/time-picker/_example/clearable.vue 1
`; -exports[`csr snapshot test > csr test ./src/time-picker/_example/disabled.vue 1`] = ` -
-
-

- 禁用整个选择器 -

-
-
-
-
-
-
-
- - - - - - - -
-
-
-
-
-
-

- 禁用指定时间 -

-
-
-
-
-
-
-
- - - - - - - -
-
-
-
-
-
-`; - -exports[`csr snapshot test > csr test ./src/time-picker/_example/format.vue 1`] = ` -
-
-
-
-
- - - - - - - -
-
-
-
-`; - -exports[`csr snapshot test > csr test ./src/time-picker/_example/hide-clear-button.vue 1`] = ` +exports[`csr snapshot test > csr test ./src/time-picker/_example/clearable.vue 1`] = `
csr test ./src/time-picker/_example/hide-clear-butt class="t-time-picker" >
csr test ./src/time-picker/_example/hide-clear-butt csr test ./src/time-picker/_example/hide-clear-butt
`; -exports[`csr snapshot test > csr test ./src/time-picker/_example/hm.vue 1`] = ` +exports[`csr snapshot test > csr test ./src/time-picker/_example/disabled.vue 1`] = `
csr test ./src/time-picker/_example/hm.vue 1`] = ` class="t-space-item" >

- 时分选择 + 禁用整个选择器

csr test ./src/time-picker/_example/hm.vue 1`] = ` class="t-time-picker" >
csr test ./src/time-picker/_example/hm.vue 1`] = ` csr test ./src/time-picker/_example/hm.vue 1`] = ` class="t-space-item" >

- 毫秒选择 + 禁用指定时间

csr test ./src/time-picker/_example/hm.vue 1`] = ` class="t-time-picker" >
csr test ./src/time-picker/_example/hm.vue 1`] = ` csr test ./src/time-picker/_example/hm.vue 1`] = `
`; -exports[`csr snapshot test > csr test ./src/time-picker/_example/hms.vue 1`] = ` +exports[`csr snapshot test > csr test ./src/time-picker/_example/format.vue 1`] = `
@@ -134412,7 +134145,7 @@ exports[`csr snapshot test > csr test ./src/time-picker/_example/hms.vue 1`] = `
`; -exports[`csr snapshot test > csr test ./src/time-picker/_example/keyboard.vue 1`] = ` +exports[`csr snapshot test > csr test ./src/time-picker/_example/hide-clear-button.vue 1`] = `
csr test ./src/time-picker/_example/keyboard.vue 1` class="t-space-item" >

- 允许输入 + 具备清空按钮

csr test ./src/time-picker/_example/keyboard.vue 1` class="t-input__wrap" >
csr test ./src/time-picker/_example/keyboard.vue 1` autocomplete="" class="t-input__inner" placeholder="" + readonly="readonly" type="text" - unselectable="off" + unselectable="on" /> csr test ./src/time-picker/_example/keyboard.vue 1` class="t-space-item" >

- 禁止输入 + 禁止清空按钮

csr test ./src/time-picker/_example/keyboard.vue 1` class="t-time-picker" >
csr test ./src/time-picker/_example/keyboard.vue 1` csr test ./src/time-picker/_example/keyboard.vue 1`
`; -exports[`csr snapshot test > csr test ./src/time-picker/_example/panel.vue 1`] = ` +exports[`csr snapshot test > csr test ./src/time-picker/_example/hm.vue 1`] = `
csr test ./src/time-picker/_example/panel.vue 1`] =
-
- - -
-
-
-
-
-
-
-
-
-
-
+

+ 时分选择 +

-
-`; - -exports[`csr snapshot test > csr test ./src/time-picker/_example/range.vue 1`] = ` -
-
- -
-
-
- - -
-
-
- -
-
+ class="t-input__prefix" + /> + csr test ./src/time-picker/_example/range.vue 1`] =
-
-`; - -exports[`csr snapshot test > csr test ./src/time-picker/_example/show-steps.vue 1`] = ` -
+

+ 毫秒选择 +

+
+
- - - - - - - + + + + + + +
+
`; -exports[`csr snapshot test > csr test ./src/time-picker/_example/step.vue 1`] = ` +exports[`csr snapshot test > csr test ./src/time-picker/_example/hms.vue 1`] = ` +
+
+
+
+
+ + + + + + + +
+
+
+
+`; + +exports[`csr snapshot test > csr test ./src/time-picker/_example/keyboard.vue 1`] = ` +
+
+

+ 允许输入 +

+
+
+
+
+
+
+
+ + + + + + + +
+
+
+
+
+
+

+ 禁止输入 +

+
+
+
+
+
+
+
+ + + + + + + +
+
+
+
+
+
+`; + +exports[`csr snapshot test > csr test ./src/time-picker/_example/panel.vue 1`] = ` +
+
+
+ + +
+
+
+
+
+
+
+
+
+
+
+
+
+`; + +exports[`csr snapshot test > csr test ./src/time-picker/_example/range.vue 1`] = ` +
+
+
+
+
+
+
+
+ +
+
+
+ - +
+
+
+ +
+
+ + + + + + +
+
+
+
+
+
+`; + +exports[`csr snapshot test > csr test ./src/time-picker/_example/show-steps.vue 1`] = ` +
+
+
+
+
+ + + + + + + +
+
+
+
+`; + +exports[`csr snapshot test > csr test ./src/time-picker/_example/step.vue 1`] = `
@@ -141315,7 +141356,349 @@ exports[`csr snapshot test > csr test ./src/transfer/_example/tree.vue 1`] = `
-
+ +
+ + + + + + +
+
+ + +
+
+ + + + + + +
+
+ + + + + + +
+
+ + +
+
+ + +
+
+ + + + + + +
+
+ + +
+
+ + +
+
@@ -141537,12 +141920,13 @@ exports[`csr snapshot test > csr test ./src/tree/_example/activable.vue 1`] = ` class="t-tree__list" enteractiveclass="t-tree__item--enter-active" leaveactiveclass="t-tree__item--leave-active" + style="transform: translateY(0px);" tag="div" >
@@ -141579,7 +141963,7 @@ exports[`csr snapshot test > csr test ./src/tree/_example/activable.vue 1`] = `
@@ -141602,7 +141986,7 @@ exports[`csr snapshot test > csr test ./src/tree/_example/activable.vue 1`] = `
@@ -141625,7 +142009,7 @@ exports[`csr snapshot test > csr test ./src/tree/_example/activable.vue 1`] = `
@@ -141662,7 +142046,7 @@ exports[`csr snapshot test > csr test ./src/tree/_example/activable.vue 1`] = `
@@ -141685,7 +142069,7 @@ exports[`csr snapshot test > csr test ./src/tree/_example/activable.vue 1`] = `
@@ -141724,12 +142108,13 @@ exports[`csr snapshot test > csr test ./src/tree/_example/base.vue 1`] = ` class="t-tree__list" enteractiveclass="t-tree__item--enter-active" leaveactiveclass="t-tree__item--leave-active" + style="transform: translateY(0px);" tag="div" >
@@ -141766,7 +142151,7 @@ exports[`csr snapshot test > csr test ./src/tree/_example/base.vue 1`] = `
@@ -141803,7 +142188,7 @@ exports[`csr snapshot test > csr test ./src/tree/_example/base.vue 1`] = `
@@ -141840,7 +142225,7 @@ exports[`csr snapshot test > csr test ./src/tree/_example/base.vue 1`] = `
@@ -142065,6 +142450,7 @@ exports[`csr snapshot test > csr test ./src/tree/_example/checkable.vue 1`] = ` class="t-tree__list" enteractiveclass="t-tree__item--enter-active" leaveactiveclass="t-tree__item--leave-active" + style="transform: translateY(0px);" tag="div" >
csr test ./src/tree/_example/controlled.vue 1`] = ` class="t-tree__list" enteractiveclass="t-tree__item--enter-active" leaveactiveclass="t-tree__item--leave-active" + style="transform: translateY(0px);" tag="div" >
csr test ./src/tree/_example/data.vue 1`] = ` class="t-tree__list" enteractiveclass="t-tree__item--enter-active" leaveactiveclass="t-tree__item--leave-active" + style="transform: translateY(0px);" tag="div" >
csr test ./src/tree/_example/disabled.vue 1`] = ` class="t-tree__list" enteractiveclass="t-tree__item--enter-active" leaveactiveclass="t-tree__item--leave-active" + style="transform: translateY(0px);" tag="div" >
@@ -143912,7 +144301,7 @@ exports[`csr snapshot test > csr test ./src/tree/_example/disabled.vue 1`] = ` @@ -143929,7 +144318,7 @@ exports[`csr snapshot test > csr test ./src/tree/_example/disabled.vue 1`] = `
@@ -143958,7 +144347,7 @@ exports[`csr snapshot test > csr test ./src/tree/_example/disabled.vue 1`] = ` @@ -143975,7 +144364,7 @@ exports[`csr snapshot test > csr test ./src/tree/_example/disabled.vue 1`] = `
@@ -143990,7 +144379,7 @@ exports[`csr snapshot test > csr test ./src/tree/_example/disabled.vue 1`] = ` @@ -144007,7 +144396,7 @@ exports[`csr snapshot test > csr test ./src/tree/_example/disabled.vue 1`] = `
@@ -144022,7 +144411,7 @@ exports[`csr snapshot test > csr test ./src/tree/_example/disabled.vue 1`] = ` @@ -144039,7 +144428,7 @@ exports[`csr snapshot test > csr test ./src/tree/_example/disabled.vue 1`] = `
@@ -144068,7 +144457,7 @@ exports[`csr snapshot test > csr test ./src/tree/_example/disabled.vue 1`] = ` @@ -144085,7 +144474,7 @@ exports[`csr snapshot test > csr test ./src/tree/_example/disabled.vue 1`] = `
@@ -144100,7 +144489,7 @@ exports[`csr snapshot test > csr test ./src/tree/_example/disabled.vue 1`] = ` @@ -144117,7 +144506,7 @@ exports[`csr snapshot test > csr test ./src/tree/_example/disabled.vue 1`] = `
@@ -144132,7 +144521,7 @@ exports[`csr snapshot test > csr test ./src/tree/_example/disabled.vue 1`] = ` @@ -144149,7 +144538,7 @@ exports[`csr snapshot test > csr test ./src/tree/_example/disabled.vue 1`] = `
@@ -144178,7 +144567,7 @@ exports[`csr snapshot test > csr test ./src/tree/_example/disabled.vue 1`] = ` @@ -144195,7 +144584,7 @@ exports[`csr snapshot test > csr test ./src/tree/_example/disabled.vue 1`] = `
@@ -144210,7 +144599,7 @@ exports[`csr snapshot test > csr test ./src/tree/_example/disabled.vue 1`] = ` @@ -144227,7 +144616,7 @@ exports[`csr snapshot test > csr test ./src/tree/_example/disabled.vue 1`] = `
@@ -144242,7 +144631,7 @@ exports[`csr snapshot test > csr test ./src/tree/_example/disabled.vue 1`] = ` @@ -144304,12 +144693,13 @@ exports[`csr snapshot test > csr test ./src/tree/_example/disabled.vue 1`] = ` class="t-tree__list" enteractiveclass="t-tree__item--enter-active" leaveactiveclass="t-tree__item--leave-active" + style="transform: translateY(0px);" tag="div" >
@@ -144337,7 +144727,7 @@ exports[`csr snapshot test > csr test ./src/tree/_example/disabled.vue 1`] = ` > @@ -144354,7 +144744,7 @@ exports[`csr snapshot test > csr test ./src/tree/_example/disabled.vue 1`] = `
@@ -144383,7 +144773,7 @@ exports[`csr snapshot test > csr test ./src/tree/_example/disabled.vue 1`] = ` @@ -144400,7 +144790,7 @@ exports[`csr snapshot test > csr test ./src/tree/_example/disabled.vue 1`] = `
@@ -144414,7 +144804,7 @@ exports[`csr snapshot test > csr test ./src/tree/_example/disabled.vue 1`] = ` > @@ -144431,7 +144821,7 @@ exports[`csr snapshot test > csr test ./src/tree/_example/disabled.vue 1`] = `
@@ -144445,7 +144835,7 @@ exports[`csr snapshot test > csr test ./src/tree/_example/disabled.vue 1`] = ` > @@ -144462,7 +144852,7 @@ exports[`csr snapshot test > csr test ./src/tree/_example/disabled.vue 1`] = `
@@ -144491,7 +144881,7 @@ exports[`csr snapshot test > csr test ./src/tree/_example/disabled.vue 1`] = ` @@ -144508,7 +144898,7 @@ exports[`csr snapshot test > csr test ./src/tree/_example/disabled.vue 1`] = `
@@ -144522,7 +144912,7 @@ exports[`csr snapshot test > csr test ./src/tree/_example/disabled.vue 1`] = ` > @@ -144539,7 +144929,7 @@ exports[`csr snapshot test > csr test ./src/tree/_example/disabled.vue 1`] = `
@@ -144553,7 +144943,7 @@ exports[`csr snapshot test > csr test ./src/tree/_example/disabled.vue 1`] = ` > @@ -144570,7 +144960,7 @@ exports[`csr snapshot test > csr test ./src/tree/_example/disabled.vue 1`] = `
@@ -144598,7 +144988,7 @@ exports[`csr snapshot test > csr test ./src/tree/_example/disabled.vue 1`] = ` > @@ -144615,7 +145005,7 @@ exports[`csr snapshot test > csr test ./src/tree/_example/disabled.vue 1`] = `
@@ -144630,7 +145020,7 @@ exports[`csr snapshot test > csr test ./src/tree/_example/disabled.vue 1`] = ` @@ -144647,7 +145037,7 @@ exports[`csr snapshot test > csr test ./src/tree/_example/disabled.vue 1`] = `
@@ -144661,7 +145051,7 @@ exports[`csr snapshot test > csr test ./src/tree/_example/disabled.vue 1`] = ` > @@ -144693,6 +145083,7 @@ exports[`csr snapshot test > csr test ./src/tree/_example/draggable.vue 1`] = ` class="t-tree__list" enteractiveclass="t-tree__item--enter-active" leaveactiveclass="t-tree__item--leave-active" + style="transform: translateY(0px);" tag="div" >
csr test ./src/tree/_example/expand-all.vue 1`] = ` class="t-tree__list" enteractiveclass="t-tree__item--enter-active" leaveactiveclass="t-tree__item--leave-active" + style="transform: translateY(0px);" tag="div" >
@@ -145216,7 +145608,7 @@ exports[`csr snapshot test > csr test ./src/tree/_example/expand-all.vue 1`] = `
@@ -145253,7 +145645,7 @@ exports[`csr snapshot test > csr test ./src/tree/_example/expand-all.vue 1`] = `
@@ -145276,7 +145668,7 @@ exports[`csr snapshot test > csr test ./src/tree/_example/expand-all.vue 1`] = `
@@ -145299,7 +145691,7 @@ exports[`csr snapshot test > csr test ./src/tree/_example/expand-all.vue 1`] = `
@@ -145336,7 +145728,7 @@ exports[`csr snapshot test > csr test ./src/tree/_example/expand-all.vue 1`] = `
@@ -145359,7 +145751,7 @@ exports[`csr snapshot test > csr test ./src/tree/_example/expand-all.vue 1`] = `
@@ -145382,7 +145774,7 @@ exports[`csr snapshot test > csr test ./src/tree/_example/expand-all.vue 1`] = `
@@ -145419,7 +145811,7 @@ exports[`csr snapshot test > csr test ./src/tree/_example/expand-all.vue 1`] = `
@@ -145442,7 +145834,7 @@ exports[`csr snapshot test > csr test ./src/tree/_example/expand-all.vue 1`] = `
@@ -145477,12 +145869,13 @@ exports[`csr snapshot test > csr test ./src/tree/_example/expand-level.vue 1`] = class="t-tree__list" enteractiveclass="t-tree__item--enter-active" leaveactiveclass="t-tree__item--leave-active" + style="transform: translateY(0px);" tag="div" >
@@ -145519,7 +145912,7 @@ exports[`csr snapshot test > csr test ./src/tree/_example/expand-level.vue 1`] =
@@ -145556,7 +145949,7 @@ exports[`csr snapshot test > csr test ./src/tree/_example/expand-level.vue 1`] =
@@ -145593,7 +145986,7 @@ exports[`csr snapshot test > csr test ./src/tree/_example/expand-level.vue 1`] =
@@ -145630,7 +146023,7 @@ exports[`csr snapshot test > csr test ./src/tree/_example/expand-level.vue 1`] =
@@ -145653,7 +146046,7 @@ exports[`csr snapshot test > csr test ./src/tree/_example/expand-level.vue 1`] =
@@ -145770,12 +146163,13 @@ exports[`csr snapshot test > csr test ./src/tree/_example/expand-mutex.vue 1`] = class="t-tree__list" enteractiveclass="t-tree__item--enter-active" leaveactiveclass="t-tree__item--leave-active" + style="transform: translateY(0px);" tag="div" >
@@ -145812,7 +146206,7 @@ exports[`csr snapshot test > csr test ./src/tree/_example/expand-mutex.vue 1`] =
@@ -145860,34 +146254,119 @@ exports[`csr snapshot test > csr test ./src/tree/_example/filter.vue 1`] = `
-
- - - filter: - - +
+
+
+
+ + + filter: + + +
+
+ +
+
+
+
+
+
- + +
+
+
+
+ +
+
+
-
+
+
+ +
+
+
+
+ +
+
+
+
+
+
csr test ./src/tree/_example/filter.vue 1`] = ` class="t-tree__list" enteractiveclass="t-tree__item--enter-active" leaveactiveclass="t-tree__item--leave-active" + style="transform: translateY(0px);" tag="div" >
csr test ./src/tree/_example/icon.vue 1`] = ` class="t-tree__list" enteractiveclass="t-tree__item--enter-active" leaveactiveclass="t-tree__item--leave-active" + style="transform: translateY(0px);" tag="div" >
@@ -146043,7 +146524,7 @@ exports[`csr snapshot test > csr test ./src/tree/_example/icon.vue 1`] = `
@@ -146095,12 +146576,13 @@ exports[`csr snapshot test > csr test ./src/tree/_example/icon.vue 1`] = ` class="t-tree__list" enteractiveclass="t-tree__item--enter-active" leaveactiveclass="t-tree__item--leave-active" + style="transform: translateY(0px);" tag="div" >
@@ -146132,7 +146614,7 @@ exports[`csr snapshot test > csr test ./src/tree/_example/icon.vue 1`] = `
@@ -146187,12 +146669,13 @@ exports[`csr snapshot test > csr test ./src/tree/_example/label.vue 1`] = ` class="t-tree__list" enteractiveclass="t-tree__item--enter-active" leaveactiveclass="t-tree__item--leave-active" + style="transform: translateY(0px);" tag="div" >
@@ -146223,7 +146706,7 @@ exports[`csr snapshot test > csr test ./src/tree/_example/label.vue 1`] = ` style="position: relative;" > - value: t81, label: 1 + value: t424, label: 1 @@ -146231,7 +146714,7 @@ exports[`csr snapshot test > csr test ./src/tree/_example/label.vue 1`] = `
@@ -146248,7 +146731,7 @@ exports[`csr snapshot test > csr test ./src/tree/_example/label.vue 1`] = ` style="position: relative;" > - value: t82, label: 1.1 + value: t425, label: 1.1 @@ -146256,7 +146739,7 @@ exports[`csr snapshot test > csr test ./src/tree/_example/label.vue 1`] = `
@@ -146273,7 +146756,7 @@ exports[`csr snapshot test > csr test ./src/tree/_example/label.vue 1`] = ` style="position: relative;" > - value: t83, label: 1.2 + value: t426, label: 1.2 @@ -146281,7 +146764,7 @@ exports[`csr snapshot test > csr test ./src/tree/_example/label.vue 1`] = `
@@ -146312,7 +146795,7 @@ exports[`csr snapshot test > csr test ./src/tree/_example/label.vue 1`] = ` style="position: relative;" > - value: t84, label: 2 + value: t427, label: 2 @@ -146320,7 +146803,7 @@ exports[`csr snapshot test > csr test ./src/tree/_example/label.vue 1`] = `
@@ -146337,7 +146820,7 @@ exports[`csr snapshot test > csr test ./src/tree/_example/label.vue 1`] = ` style="position: relative;" > - value: t85, label: 2.1 + value: t428, label: 2.1 @@ -146345,7 +146828,7 @@ exports[`csr snapshot test > csr test ./src/tree/_example/label.vue 1`] = `
@@ -146362,7 +146845,7 @@ exports[`csr snapshot test > csr test ./src/tree/_example/label.vue 1`] = ` style="position: relative;" > - value: t86, label: 2.2 + value: t429, label: 2.2 @@ -146385,12 +146868,13 @@ exports[`csr snapshot test > csr test ./src/tree/_example/label.vue 1`] = ` class="t-tree__list" enteractiveclass="t-tree__item--enter-active" leaveactiveclass="t-tree__item--leave-active" + style="transform: translateY(0px);" tag="div" >
@@ -146418,7 +146902,7 @@ exports[`csr snapshot test > csr test ./src/tree/_example/label.vue 1`] = ` > @@ -146431,7 +146915,7 @@ exports[`csr snapshot test > csr test ./src/tree/_example/label.vue 1`] = ` - label: 1, value: t87 + label: 1, value: t430 @@ -146439,7 +146923,7 @@ exports[`csr snapshot test > csr test ./src/tree/_example/label.vue 1`] = `
@@ -146453,7 +146937,7 @@ exports[`csr snapshot test > csr test ./src/tree/_example/label.vue 1`] = ` > @@ -146466,7 +146950,7 @@ exports[`csr snapshot test > csr test ./src/tree/_example/label.vue 1`] = ` - label: 1.1, value: t88 + label: 1.1, value: t431 @@ -146474,7 +146958,7 @@ exports[`csr snapshot test > csr test ./src/tree/_example/label.vue 1`] = `
@@ -146488,7 +146972,7 @@ exports[`csr snapshot test > csr test ./src/tree/_example/label.vue 1`] = ` > @@ -146501,7 +146985,7 @@ exports[`csr snapshot test > csr test ./src/tree/_example/label.vue 1`] = ` - label: 1.2, value: t89 + label: 1.2, value: t432 @@ -146509,7 +146993,7 @@ exports[`csr snapshot test > csr test ./src/tree/_example/label.vue 1`] = `
@@ -146537,7 +147021,7 @@ exports[`csr snapshot test > csr test ./src/tree/_example/label.vue 1`] = ` > @@ -146550,7 +147034,7 @@ exports[`csr snapshot test > csr test ./src/tree/_example/label.vue 1`] = ` - label: 2, value: t90 + label: 2, value: t433 @@ -146558,7 +147042,7 @@ exports[`csr snapshot test > csr test ./src/tree/_example/label.vue 1`] = `
@@ -146572,7 +147056,7 @@ exports[`csr snapshot test > csr test ./src/tree/_example/label.vue 1`] = ` > @@ -146585,7 +147069,7 @@ exports[`csr snapshot test > csr test ./src/tree/_example/label.vue 1`] = ` - label: 2.1, value: t91 + label: 2.1, value: t434 @@ -146593,7 +147077,7 @@ exports[`csr snapshot test > csr test ./src/tree/_example/label.vue 1`] = `
@@ -146607,7 +147091,7 @@ exports[`csr snapshot test > csr test ./src/tree/_example/label.vue 1`] = ` > @@ -146620,7 +147104,7 @@ exports[`csr snapshot test > csr test ./src/tree/_example/label.vue 1`] = ` - label: 2.2, value: t92 + label: 2.2, value: t435 @@ -146760,6 +147244,7 @@ exports[`csr snapshot test > csr test ./src/tree/_example/lazy.vue 1`] = ` class="t-tree__list" enteractiveclass="t-tree__item--enter-active" leaveactiveclass="t-tree__item--leave-active" + style="transform: translateY(0px);" tag="div" >
csr test ./src/tree/_example/line.vue 1`] = ` class="t-tree__list" enteractiveclass="t-tree__item--enter-active" leaveactiveclass="t-tree__item--leave-active" + style="transform: translateY(0px);" tag="div" >
csr test ./src/tree/_example/line.vue 1`] = ` class="t-tree__list" enteractiveclass="t-tree__item--enter-active" leaveactiveclass="t-tree__item--leave-active" + style="transform: translateY(0px);" tag="div" >
csr test ./src/tree/_example/line.vue 1`] = ` class="t-tree__list" enteractiveclass="t-tree__item--enter-active" leaveactiveclass="t-tree__item--leave-active" + style="transform: translateY(0px);" tag="div" >
csr test ./src/tree/_example/load.vue 1`] = ` class="t-tree__list" enteractiveclass="t-tree__item--enter-active" leaveactiveclass="t-tree__item--leave-active" + style="transform: translateY(0px);" tag="div" >
csr test ./src/tree/_example/load.vue 1`] = ` exports[`csr snapshot test > csr test ./src/tree/_example/operations.vue 1`] = `
csr test ./src/tree/_example/operations.vue 1`] = ` >
-

+

Render:

@@ -149197,12 +149682,12 @@ exports[`csr snapshot test > csr test ./src/tree/_example/operations.vue 1`] = ` >
csr test ./src/tree/_example/operations.vue 1`] = ` >
-

+

Scope Slot:

@@ -149290,11 +149772,9 @@ exports[`csr snapshot test > csr test ./src/tree/_example/operations.vue 1`] = ` >
csr test ./src/tree/_example/operations.vue 1`] = ` >
csr test ./src/tree/_example/operations.vue 1`] = `
csr test ./src/tree/_example/operations.vue 1`] = ` >
csr test ./src/tree/_example/operations.vue 1`] = ` >
csr test ./src/tree/_example/operations.vue 1`] = `
csr test ./src/tree/_example/operations.vue 1`] = ` >
csr test ./src/tree/_example/operations.vue 1`] = ` >
csr test ./src/tree/_example/operations.vue 1`] = ` > - + +
-
+
+
+
- - - - - - - +
+
- - -
- -
-
- - - - -
- - +
-
+
+
+
- - - +
+
+
- -
+
- - 删除 - - +
+ 切换滚动模式后需要刷新页面 +
+
+
- +
-
- - - - -
- - -
-
-
-
- - - - - - - - -
- - -
-
-
-
- - - - -
- - -
-
-
-
- - - - -
- - -
-
-
-
- - - - -
- - -
-
-
-
- - - - - - - - -
- - -
-
-
-
- - - - -
- - -
-
-
-
- - - - -
- - -
-
-
-
- - - - -
- - -
-
-
-
- - - - - - - -
- - -
-
-
-
- - - - - - - - -
- - -
-
-
-
- - - - -
- - -
-
-
-
- - - - -
- - -
-
-
-
- - - - -
- - -
-
-
-
- - - - - - - - -
- - -
-
-
-
- - - - -
- - -
-
-
-
- - - - -
- - -
-
-
-
- - - - -
- - -
-
-
-
- - - - - - - - -
- - -
-
-
-
- - - - -
- - -
-
-
-
- - - - -
- - -
-
-
-
- - - - -
- - -
-
-
-
- - - - - - - -
- - -
-
-
-
- - - - - - - - -
- - -
-
-
-
- - - - -
- - -
-
-
-
- - - - -
- - -
-
-
-
- - - - -
- - -
-
-
-
- - - - - - - - -
- - -
-
-
-
- - - - -
- - -
-
-
-
- - - - -
- - -
-
-
-
- - - - -
- - -
-
-
-
- - - - - - - - -
- - -
-
-
-
- - - - -
- - -
-
-
-
- - - - -
- - -
-
-
-
- - - - -
- - -
-
-
-
+
+ +
+
+
`; diff --git a/test/snap/__snapshots__/ssr.test.js.snap b/test/snap/__snapshots__/ssr.test.js.snap index e2a209529..49de96016 100644 --- a/test/snap/__snapshots__/ssr.test.js.snap +++ b/test/snap/__snapshots__/ssr.test.js.snap @@ -278,7 +278,7 @@ exports[`ssr snapshot test > renders ./src/config-provider/_example/global.vue c exports[`ssr snapshot test > renders ./src/config-provider/_example/input.vue correctly 1`] = `"
"`; -exports[`ssr snapshot test > renders ./src/config-provider/_example/others.vue correctly 1`] = `"


0 / 20
0 / 0
Empty Data





















Feature TagFeature TagFeature TagFeature Tag



Department A
Department B



First Step
You need to click the blue button
Second Step
Fill your base information into the form
Error Step
Something Wrong! Custom Error Icon!
4
Last Step
You haven't finish this step.


\\"\\"
图片加载中
"`; +exports[`ssr snapshot test > renders ./src/config-provider/_example/others.vue correctly 1`] = `"


0 / 20
0 / 0
Empty Data





















Feature TagFeature TagFeature TagFeature Tag



Department A
Department B



First Step
You need to click the blue button
Second Step
Fill your base information into the form
Error Step
Something Wrong! Custom Error Icon!
4
Last Step
You haven't finish this step.


\\"\\"
图片加载中
"`; exports[`ssr snapshot test > renders ./src/config-provider/_example/pagination.vue correctly 1`] = `"
Total 36 items
10 / page
  • 1
  • 2
  • 3
  • 4
jump to
/ 4
"`; @@ -386,7 +386,7 @@ exports[`ssr snapshot test > renders ./src/form/_example/clear-validate.vue corr exports[`ssr snapshot test > renders ./src/form/_example/custom-validator.vue correctly 1`] = `"
同一个校验方法可输出不同的错误信息和类型,依次输入:1234 观察变化
自定义异步校验方法
"`; -exports[`ssr snapshot test > renders ./src/form/_example/disabled.vue correctly 1`] = `"
接受
请选择单张图片文件上传
"`; +exports[`ssr snapshot test > renders ./src/form/_example/disabled.vue correctly 1`] = `"
接受
请选择单张图片文件上传
"`; exports[`ssr snapshot test > renders ./src/form/_example/error-message.vue correctly 1`] = `"
这里可以展示一段说明文字
一句话介绍自己
"`; @@ -725,6 +725,8 @@ exports[`ssr snapshot test > renders ./src/popup/_example/disabled.vue correctly exports[`ssr snapshot test > renders ./src/popup/_example/placement.vue correctly 1`] = `"
"`; +exports[`ssr snapshot test > renders ./src/popup/_example/plugin.vue correctly 1`] = `"
"`; + exports[`ssr snapshot test > renders ./src/popup/_example/style.vue correctly 1`] = `"
"`; exports[`ssr snapshot test > renders ./src/popup/_example/trigger.vue correctly 1`] = `"
"`; @@ -988,7 +990,7 @@ exports[`ssr snapshot test > renders ./src/table/_example/multiple-sort.vue corr exports[`ssr snapshot test > renders ./src/table/_example/pagination.vue correctly 1`] = `"
序号
申请人
申请状态
签署方式
申请时间
6王芳审批过期纸质签署2022-02-01
7贾明审批通过电子签署2022-03-01
8张三审批失败纸质签署2022-04-01
9王芳审批过期纸质签署2022-01-01
10贾明审批通过电子签署2022-02-01
共 59 项数据
5 条/页
  • 1
  • 2
  • 3
  • 4
  • 5
  • 12
跳至
/ 12 页
"`; -exports[`ssr snapshot test > renders ./src/table/_example/pagination-ajax.vue correctly 1`] = `"
申请人
申请状态
联系方式
邮箱
共 0 项数据
10 条/页
  • 1
跳至
/ 1 页
"`; +exports[`ssr snapshot test > renders ./src/table/_example/pagination-ajax.vue correctly 1`] = `"
申请人
申请状态
联系方式
邮箱
共 0 项数据
10 条/页
  • 1
跳至
/ 1 页
"`; exports[`ssr snapshot test > renders ./src/table/_example/select-multiple.vue correctly 1`] = `"
申请人
申请状态
签署方式
邮箱地址
申请时间
贾明审批通过电子签署
w.cezkdudy@lhll.au
2022-01-01
张三审批失败纸质签署
r.nmgw@peurezgn.sl
2022-02-01
王芳审批过期纸质签署
p.cumx@rampblpa.ru
2022-03-01
贾明审批通过电子签署
w.cezkdudy@lhll.au
2022-04-01
张三审批失败纸质签署
r.nmgw@peurezgn.sl
2022-01-01
"`; @@ -1073,9 +1075,9 @@ exports[`ssr snapshot test > renders ./src/textarea/_example/base.vue correctly exports[`ssr snapshot test > renders ./src/textarea/_example/events.vue correctly 1`] = `"
"`; -exports[`ssr snapshot test > renders ./src/textarea/_example/maxlength.vue correctly 1`] = `"
0/20
0/20
"`; +exports[`ssr snapshot test > renders ./src/textarea/_example/maxlength.vue correctly 1`] = `"
这里可以放一些提示文字
0/20
0/20
"`; -exports[`ssr snapshot test > renders ./src/textarea/_example/type.vue correctly 1`] = `"
这是普通文本提示
校验通过文本提示
校验不通过文本提示
校验存在严重问题文本提示
"`; +exports[`ssr snapshot test > renders ./src/textarea/_example/type.vue correctly 1`] = `"
这是普通文本提示
校验通过文本提示
校验不通过文本提示
校验存在严重问题文本提示
"`; exports[`ssr snapshot test > renders ./src/time-picker/_example/base.vue correctly 1`] = `"
"`; @@ -1149,53 +1151,53 @@ exports[`ssr snapshot test > renders ./src/transfer/_example/search.vue correctl exports[`ssr snapshot test > renders ./src/transfer/_example/target-value.vue correctly 1`] = `"
0 / 10 项
0 / 10 项
"`; -exports[`ssr snapshot test > renders ./src/transfer/_example/tree.vue correctly 1`] = `"
0 / 5 项
0 / 0 项
暂无数据
"`; +exports[`ssr snapshot test > renders ./src/transfer/_example/tree.vue correctly 1`] = `"
0 / 5 项
0 / 0 项
暂无数据
"`; -exports[`ssr snapshot test > renders ./src/tree/_example/activable.vue correctly 1`] = `"
1
1.1
1.2
2
2.1
2.2
"`; +exports[`ssr snapshot test > renders ./src/tree/_example/activable.vue correctly 1`] = `"
1
1.1
1.2
2
2.1
2.2
"`; -exports[`ssr snapshot test > renders ./src/tree/_example/base.vue correctly 1`] = `"
第一段
第一段
第一段
第一段
"`; +exports[`ssr snapshot test > renders ./src/tree/_example/base.vue correctly 1`] = `"
第一段
第一段
第一段
第一段
"`; -exports[`ssr snapshot test > renders ./src/tree/_example/checkable.vue correctly 1`] = `"
"`; +exports[`ssr snapshot test > renders ./src/tree/_example/checkable.vue correctly 1`] = `"
"`; -exports[`ssr snapshot test > renders ./src/tree/_example/controlled.vue correctly 1`] = `"
checked:
expanded:
actived:
"`; +exports[`ssr snapshot test > renders ./src/tree/_example/controlled.vue correctly 1`] = `"
checked:
expanded:
actived:
"`; -exports[`ssr snapshot test > renders ./src/tree/_example/data.vue correctly 1`] = `"

数据切换

"`; +exports[`ssr snapshot test > renders ./src/tree/_example/data.vue correctly 1`] = `"

数据切换

"`; -exports[`ssr snapshot test > renders ./src/tree/_example/disabled.vue correctly 1`] = `"
"`; +exports[`ssr snapshot test > renders ./src/tree/_example/disabled.vue correctly 1`] = `"
"`; -exports[`ssr snapshot test > renders ./src/tree/_example/draggable.vue correctly 1`] = `"
1
1.1
1.1.1
1.1.1.1
1.1.1.2
1.1.2
1.1.2.1
1.1.2.2
2
2.1
2.2
"`; +exports[`ssr snapshot test > renders ./src/tree/_example/draggable.vue correctly 1`] = `"
1
1.1
1.1.1
1.1.1.1
1.1.1.2
1.1.2
1.1.2.1
1.1.2.2
2
2.1
2.2
"`; exports[`ssr snapshot test > renders ./src/tree/_example/empty.vue correctly 1`] = `"



"`; -exports[`ssr snapshot test > renders ./src/tree/_example/expand-all.vue correctly 1`] = `"
1
1.1
1.1.1
1.1.2
1.2
1.2.1
1.2.2
2
2.1
2.2
"`; +exports[`ssr snapshot test > renders ./src/tree/_example/expand-all.vue correctly 1`] = `"
1
1.1
1.1.1
1.1.2
1.2
1.2.1
1.2.2
2
2.1
2.2
"`; -exports[`ssr snapshot test > renders ./src/tree/_example/expand-level.vue correctly 1`] = `"
1
1.1
1.2
2
2.1
2.2
"`; +exports[`ssr snapshot test > renders ./src/tree/_example/expand-level.vue correctly 1`] = `"
1
1.1
1.2
2
2.1
2.2
"`; -exports[`ssr snapshot test > renders ./src/tree/_example/expand-mutex.vue correctly 1`] = `"
1
2
"`; +exports[`ssr snapshot test > renders ./src/tree/_example/expand-mutex.vue correctly 1`] = `"
1
2
"`; -exports[`ssr snapshot test > renders ./src/tree/_example/filter.vue correctly 1`] = `"
filter:
1
2
"`; +exports[`ssr snapshot test > renders ./src/tree/_example/filter.vue correctly 1`] = `"
filter:
1
2
"`; -exports[`ssr snapshot test > renders ./src/tree/_example/icon.vue correctly 1`] = `"

render:

1
2

scope slot:

1
2
"`; +exports[`ssr snapshot test > renders ./src/tree/_example/icon.vue correctly 1`] = `"

render:

1
2

scope slot:

1
2
"`; -exports[`ssr snapshot test > renders ./src/tree/_example/label.vue correctly 1`] = `"

render:

value: t173, label: 1
value: t174, label: 1.1
value: t175, label: 1.2
value: t176, label: 2
value: t177, label: 2.1
value: t178, label: 2.2

scope slot:

"`; +exports[`ssr snapshot test > renders ./src/tree/_example/label.vue correctly 1`] = `"

render:

value: t859, label: 1
value: t860, label: 1.1
value: t861, label: 1.2
value: t862, label: 2
value: t863, label: 2.1
value: t864, label: 2.2

scope slot:

"`; -exports[`ssr snapshot test > renders ./src/tree/_example/lazy.vue correctly 1`] = `"

数据延迟加载

默认为点击加载数据。

valueMode 默认为 'onlyLeaf'。选中父节点时,子节点由于未加载,无法更新和获取选中状态,导致无法更新父节点的状态。

所以使用延迟加载时,推荐 valueMode 设置为 'all' 或者 'parentFirst'。

"`; +exports[`ssr snapshot test > renders ./src/tree/_example/lazy.vue correctly 1`] = `"

数据延迟加载

默认为点击加载数据。

valueMode 默认为 'onlyLeaf'。选中父节点时,子节点由于未加载,无法更新和获取选中状态,导致无法更新父节点的状态。

所以使用延迟加载时,推荐 valueMode 设置为 'all' 或者 'parentFirst'。

"`; -exports[`ssr snapshot test > renders ./src/tree/_example/line.vue correctly 1`] = `"
1
1.1
1.2
2
2.1
2.1.1
2.1.1.1
2.1.1.1.1
2.1.1.1.2
2.1.2
2.2
3
3.1
3.2
4

render

1
1.1
1.2
2
2.1
2.1.1
2.1.1.1
2.1.1.1.1
2.1.1.1.2
2.1.2
2.2
3
3.1
3.2
4

scope slot

1
1.1
1.2
2
2.1
2.1.1
2.1.1.1
2.1.1.1.1
2.1.1.1.2
2.1.2
2.2
3
3.1
3.2
4
"`; +exports[`ssr snapshot test > renders ./src/tree/_example/line.vue correctly 1`] = `"
1
1.1
1.2
2
2.1
2.1.1
2.1.1.1
2.1.1.1.1
2.1.1.1.2
2.1.2
2.2
3
3.1
3.2
4

render

1
1.1
1.2
2
2.1
2.1.1
2.1.1.1
2.1.1.1.1
2.1.1.1.2
2.1.2
2.2
3
3.1
3.2
4

scope slot

1
1.1
1.2
2
2.1
2.1.1
2.1.1.1
2.1.1.1.1
2.1.1.1.2
2.1.2
2.2
3
3.1
3.2
4
"`; -exports[`ssr snapshot test > renders ./src/tree/_example/load.vue correctly 1`] = `"
"`; +exports[`ssr snapshot test > renders ./src/tree/_example/load.vue correctly 1`] = `"
"`; -exports[`ssr snapshot test > renders ./src/tree/_example/operations.vue correctly 1`] = `"

Render:

1 | value: node1value: node1
2 | value: node2value: node2

Scope Slot:

filter:

API:

* 相关信息通过控制台输出

"`; +exports[`ssr snapshot test > renders ./src/tree/_example/operations.vue correctly 1`] = `"

Render:

1 | value: node1value: node1
2 | value: node2value: node2

Scope Slot:

filter:

API:

* 相关信息通过控制台输出

"`; -exports[`ssr snapshot test > renders ./src/tree/_example/performance.vue correctly 1`] = `"
插入节点数量:
"`; +exports[`ssr snapshot test > renders ./src/tree/_example/performance.vue correctly 1`] = `"
插入节点数量:
"`; -exports[`ssr snapshot test > renders ./src/tree/_example/state.vue correctly 1`] = `"
"`; +exports[`ssr snapshot test > renders ./src/tree/_example/state.vue correctly 1`] = `"
"`; -exports[`ssr snapshot test > renders ./src/tree/_example/sync.vue correctly 1`] = `"
checked:
expanded:
actived:
"`; +exports[`ssr snapshot test > renders ./src/tree/_example/sync.vue correctly 1`] = `"
checked:
expanded:
actived:
"`; -exports[`ssr snapshot test > renders ./src/tree/_example/transition.vue correctly 1`] = `"
"`; +exports[`ssr snapshot test > renders ./src/tree/_example/transition.vue correctly 1`] = `"
"`; -exports[`ssr snapshot test > renders ./src/tree/_example/vscroll.vue correctly 1`] = `"
插入节点数量:
"`; +exports[`ssr snapshot test > renders ./src/tree/_example/vscroll.vue correctly 1`] = `"
插入节点数量:
切换滚动模式后需要刷新页面
"`; exports[`ssr snapshot test > renders ./src/tree-select/_example/base.vue correctly 1`] = `"
"`;