From d7142107e9763a3b9abdb4456ec5a5c807973890 Mon Sep 17 00:00:00 2001 From: yuyang Date: Thu, 27 Apr 2023 16:34:50 +0800 Subject: [PATCH] fix(space): slots is not reactive (#2372) * fix(space): slots is not reactive * chore: update snapshot --- .../__snapshots__/index.test.jsx.snap | 1 + .../__snapshots__/index.test.jsx.snap | 1 + src/input/input.tsx | 5 ++-- .../__snapshots__/index.test.jsx.snap | 1 + src/space/space.tsx | 12 +++------ .../__snapshots__/index.test.jsx.snap | 1 + test/snap/__snapshots__/csr.test.js.snap | 19 ++++++++++++++ test/snap/__snapshots__/ssr.test.js.snap | 26 +++++++++---------- 8 files changed, 42 insertions(+), 24 deletions(-) diff --git a/src/input-number/__tests__/__snapshots__/index.test.jsx.snap b/src/input-number/__tests__/__snapshots__/index.test.jsx.snap index 0676c6c88..588237832 100644 --- a/src/input-number/__tests__/__snapshots__/index.test.jsx.snap +++ b/src/input-number/__tests__/__snapshots__/index.test.jsx.snap @@ -92,6 +92,7 @@ exports[`InputNumber > :props > :disabled, function can not be call 1`] = ` class="t-input__inner" disabled="disabled" placeholder="请输入" + title="" type="text" unselectable="off" /> diff --git a/src/input/__tests__/__snapshots__/index.test.jsx.snap b/src/input/__tests__/__snapshots__/index.test.jsx.snap index 89b0fa438..5ee873ddd 100644 --- a/src/input/__tests__/__snapshots__/index.test.jsx.snap +++ b/src/input/__tests__/__snapshots__/index.test.jsx.snap @@ -72,6 +72,7 @@ exports[`Input > :props > :disabled 1`] = ` class="t-input__inner" disabled="disabled" placeholder="请输入" + title="" type="text" unselectable="off" /> diff --git a/src/input/input.tsx b/src/input/input.tsx index c6f49047c..3b8b19fee 100644 --- a/src/input/input.tsx +++ b/src/input/input.tsx @@ -492,7 +492,7 @@ export default mixins(getConfigReceiverMixins('input [`${this.componentName}--suffix`]: suffixIcon || suffixContent, }, ]; - + const inputTextValue = this.composingRef ? this.composingRefValue : this.inputValue; const inputNode = (
('input on={inputEvents} ref="inputRef" class={`${this.componentName}__inner`} - value={this.composingRef ? this.composingRefValue : this.inputValue} + value={inputTextValue} onInput={this.handleInput} + title={this.disabled ? inputTextValue : undefined} /> )} {this.autoWidth && ( diff --git a/src/select/__tests__/__snapshots__/index.test.jsx.snap b/src/select/__tests__/__snapshots__/index.test.jsx.snap index 0d6b9960d..e17d35acc 100644 --- a/src/select/__tests__/__snapshots__/index.test.jsx.snap +++ b/src/select/__tests__/__snapshots__/index.test.jsx.snap @@ -170,6 +170,7 @@ exports[`Select > :props > :disabled 1`] = ` disabled="disabled" placeholder="请选择" readonly="readonly" + title="" type="text" unselectable="on" /> diff --git a/src/space/space.tsx b/src/space/space.tsx index ec0fa8dde..33b27925c 100644 --- a/src/space/space.tsx +++ b/src/space/space.tsx @@ -8,7 +8,7 @@ export default defineComponent({ props: { ...props }, - setup(props, { slots }) { + setup(props) { const COMPONENT_NAME = usePrefixClass('space'); const renderStyle = computed(() => { @@ -47,21 +47,15 @@ export default defineComponent({ COMPONENT_NAME, spaceClassNames, renderStyle, - slots, }; }, render() { - const { - COMPONENT_NAME, spaceClassNames, renderStyle, slots, - } = this; - - const children = slots.default?.().filter((child) => child.tag !== undefined || child.text) || []; + const { COMPONENT_NAME, spaceClassNames, renderStyle } = this; + const children = this.$slots.default?.filter((child) => child.tag !== undefined || child.text) || []; const childCount = children?.length; - const renderChildren = () => children.map((child, index) => { const separatorNode = renderTNodeJSX(this, 'separator'); const showSeparator = index + 1 !== childCount && separatorNode; - return [
{child}
, showSeparator ?
{separatorNode}
: null, diff --git a/src/tree-select/__tests__/__snapshots__/index.test.jsx.snap b/src/tree-select/__tests__/__snapshots__/index.test.jsx.snap index 641727c66..82c006ded 100644 --- a/src/tree-select/__tests__/__snapshots__/index.test.jsx.snap +++ b/src/tree-select/__tests__/__snapshots__/index.test.jsx.snap @@ -151,6 +151,7 @@ exports[`TreeSelect > :props > :disabled 1`] = ` disabled="disabled" placeholder="请选择" readonly="readonly" + title="" type="text" unselectable="on" /> diff --git a/test/snap/__snapshots__/csr.test.js.snap b/test/snap/__snapshots__/csr.test.js.snap index 8016bb43f..3fbd28b1e 100644 --- a/test/snap/__snapshots__/csr.test.js.snap +++ b/test/snap/__snapshots__/csr.test.js.snap @@ -1846,6 +1846,7 @@ exports[`csr snapshot test > csr test ./src/auto-complete/_example/status.vue 1` class="t-input__inner" disabled="disabled" placeholder="请输入关键词搜索" + title="第一个默认联想词" type="text" unselectable="off" /> @@ -22539,6 +22540,7 @@ exports[`csr snapshot test > csr test ./src/cascader/_example/disabled.vue 1`] = disabled="disabled" placeholder="请选择" readonly="readonly" + title="选项一 / 子选项一" type="text" unselectable="on" /> @@ -31251,6 +31253,7 @@ exports[`csr snapshot test > csr test ./src/color-picker/_example/status-disable class="t-input__inner" disabled="disabled" placeholder="请输入" + title="red" type="text" unselectable="off" /> @@ -31399,6 +31402,7 @@ exports[`csr snapshot test > csr test ./src/color-picker/_example/status-readonl disabled="disabled" placeholder="请选择" readonly="readonly" + title="RGB" type="text" unselectable="on" /> @@ -31451,6 +31455,7 @@ exports[`csr snapshot test > csr test ./src/color-picker/_example/status-readonl class="t-input__inner" disabled="disabled" placeholder="请输入" + title="0" type="text" unselectable="off" /> @@ -31477,6 +31482,7 @@ exports[`csr snapshot test > csr test ./src/color-picker/_example/status-readonl class="t-input__inner" disabled="disabled" placeholder="请输入" + title="82" type="text" unselectable="off" /> @@ -31503,6 +31509,7 @@ exports[`csr snapshot test > csr test ./src/color-picker/_example/status-readonl class="t-input__inner" disabled="disabled" placeholder="请输入" + title="217" type="text" unselectable="off" /> @@ -50524,6 +50531,7 @@ exports[`csr snapshot test > csr test ./src/form/_example/disabled.vue 1`] = ` disabled="disabled" placeholder="请选择寄件地址" readonly="readonly" + title="" type="text" unselectable="on" /> @@ -50590,6 +50598,7 @@ exports[`csr snapshot test > csr test ./src/form/_example/disabled.vue 1`] = ` disabled="disabled" placeholder="请选择收件地址" readonly="readonly" + title="" type="text" unselectable="on" /> @@ -50660,6 +50669,7 @@ exports[`csr snapshot test > csr test ./src/form/_example/disabled.vue 1`] = ` disabled="disabled" placeholder="请选择日期" readonly="readonly" + title="" type="text" unselectable="on" /> @@ -50957,6 +50967,7 @@ exports[`csr snapshot test > csr test ./src/form/_example/disabled.vue 1`] = ` class="t-input__inner" disabled="disabled" placeholder="分数值" + title="" type="text" unselectable="off" /> @@ -62244,6 +62255,7 @@ exports[`csr snapshot test > csr test ./src/input/_example/status.vue 1`] = ` class="t-input__inner" disabled="disabled" placeholder="请输入" + title="禁用状态" type="text" unselectable="off" /> @@ -63579,6 +63591,7 @@ exports[`csr snapshot test > csr test ./src/input-number/_example/disabled.vue 1 class="t-input__inner" disabled="disabled" placeholder="请输入" + title="3" type="text" unselectable="off" /> @@ -76478,6 +76491,7 @@ exports[`csr snapshot test > csr test ./src/pagination/_example/disabled.vue 1`] disabled="disabled" placeholder="请选择" readonly="readonly" + title="5 条/页" type="text" unselectable="on" /> @@ -86434,6 +86448,7 @@ exports[`csr snapshot test > csr test ./src/select/_example/disabled.vue 1`] = ` class="t-input__inner" disabled="disabled" placeholder="-请选择-" + title="" type="text" unselectable="off" /> @@ -88090,6 +88105,7 @@ exports[`csr snapshot test > csr test ./src/select/_example/status.vue 1`] = ` disabled="disabled" placeholder="请选择云解决方案" readonly="readonly" + title="" type="text" unselectable="on" /> @@ -89856,6 +89872,7 @@ exports[`csr snapshot test > csr test ./src/select-input/_example/status.vue 1`] disabled="disabled" placeholder="Please Select" readonly="readonly" + title="TDesign" type="text" unselectable="on" /> @@ -134071,6 +134088,7 @@ exports[`csr snapshot test > csr test ./src/tag-input/_example/status.vue 1`] = class="t-input__inner" disabled="disabled" placeholder="" + title="" type="text" unselectable="off" /> @@ -135305,6 +135323,7 @@ exports[`csr snapshot test > csr test ./src/time-picker/_example/disabled.vue 1` disabled="disabled" placeholder="" readonly="readonly" + title="11:12:10" type="text" unselectable="on" /> diff --git a/test/snap/__snapshots__/ssr.test.js.snap b/test/snap/__snapshots__/ssr.test.js.snap index 454f30371..b196e4ad3 100644 --- a/test/snap/__snapshots__/ssr.test.js.snap +++ b/test/snap/__snapshots__/ssr.test.js.snap @@ -38,7 +38,7 @@ exports[`ssr snapshot test > renders ./src/auto-complete/_example/option.vue cor exports[`ssr snapshot test > renders ./src/auto-complete/_example/size.vue correctly 1`] = `"
小尺寸：
中尺寸：
大尺寸：
"`; -exports[`ssr snapshot test > renders ./src/auto-complete/_example/status.vue correctly 1`] = `"
这是禁用状态
这是只读状态
这是普通状态
这是告警状态
这是错误状态
这是成功状态
"`; +exports[`ssr snapshot test > renders ./src/auto-complete/_example/status.vue correctly 1`] = `"
这是禁用状态
这是只读状态
这是普通状态
这是告警状态
这是错误状态
这是成功状态
"`; exports[`ssr snapshot test > renders ./src/auto-complete/_example/trigger-element.vue correctly 1`] = `"
"`; @@ -186,7 +186,7 @@ exports[`ssr snapshot test > renders ./src/cascader/_example/check-strictly.vue exports[`ssr snapshot test > renders ./src/cascader/_example/collapsed.vue correctly 1`] = `"
选项一/子选项一+2
选项一/子选项一+2
选项一/子选项一+2
"`; -exports[`ssr snapshot test > renders ./src/cascader/_example/disabled.vue correctly 1`] = `"
选项一/子选项一
"`; +exports[`ssr snapshot test > renders ./src/cascader/_example/disabled.vue correctly 1`] = `"
选项一/子选项一
"`; exports[`ssr snapshot test > renders ./src/cascader/_example/ellipsis.vue correctly 1`] = `"
当选项一数据展示文本过长时/子选项一
"`; @@ -260,9 +260,9 @@ exports[`ssr snapshot test > renders ./src/color-picker/_example/panel.vue corre exports[`ssr snapshot test > renders ./src/color-picker/_example/recent-color.vue correctly 1`] = `"
预设最近使用色

最近使用颜色

系统预设颜色

完全不显示最近使用色

系统预设颜色

"`; -exports[`ssr snapshot test > renders ./src/color-picker/_example/status-disabled.vue correctly 1`] = `"
red
"`; +exports[`ssr snapshot test > renders ./src/color-picker/_example/status-disabled.vue correctly 1`] = `"
red
"`; -exports[`ssr snapshot test > renders ./src/color-picker/_example/status-readonly.vue correctly 1`] = `"

最近使用颜色

    系统预设颜色

    "`; +exports[`ssr snapshot test > renders ./src/color-picker/_example/status-readonly.vue correctly 1`] = `"

    最近使用颜色

      系统预设颜色

      "`; exports[`ssr snapshot test > renders ./src/color-picker/_example/swatch-color.vue correctly 1`] = `"
      自定义系统色

      最近使用颜色

        系统预设颜色

        完全不显示系统色

        最近使用颜色

          "`; @@ -398,7 +398,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`] = `"
          这里可以展示一段说明文字
          一句话介绍自己
          "`; @@ -522,7 +522,7 @@ exports[`ssr snapshot test > renders ./src/input/_example/password.vue correctly exports[`ssr snapshot test > renders ./src/input/_example/size.vue correctly 1`] = `"
          "`; -exports[`ssr snapshot test > renders ./src/input/_example/status.vue correctly 1`] = `"
          这是普通文本提示
          校验通过文本提示
          校验不通过文本提示
          校验存在严重问题文本提示
          "`; +exports[`ssr snapshot test > renders ./src/input/_example/status.vue correctly 1`] = `"
          这是普通文本提示
          校验通过文本提示
          校验不通过文本提示
          校验存在严重问题文本提示
          "`; exports[`ssr snapshot test > renders ./src/input/_example/textarea.vue correctly 1`] = `"
          文本域输入框已抽离为单独组件，更多示例请参考 Textarea 组件
          "`; @@ -538,7 +538,7 @@ exports[`ssr snapshot test > renders ./src/input-number/_example/center.vue corr exports[`ssr snapshot test > renders ./src/input-number/_example/default.vue correctly 1`] = `"
          "`; -exports[`ssr snapshot test > renders ./src/input-number/_example/disabled.vue correctly 1`] = `"
          "`; +exports[`ssr snapshot test > renders ./src/input-number/_example/disabled.vue correctly 1`] = `"
          "`; exports[`ssr snapshot test > renders ./src/input-number/_example/empty.vue correctly 1`] = `"
          "`; @@ -699,7 +699,7 @@ exports[`ssr snapshot test > renders ./src/pagination/_example/base.vue correctl exports[`ssr snapshot test > renders ./src/pagination/_example/customizable.vue correctly 1`] = `"
          共 200 项数据
          20 条/页
          • 1
          • 2
          • 3
          • 4
          • 5
          • 6
          • 7
          • 8
          • 9
          • 10
          跳至
          / 10 页
          "`; -exports[`ssr snapshot test > renders ./src/pagination/_example/disabled.vue correctly 1`] = `"
          共 100 项数据
          5 条/页
          • 1
          • 2
          • 3
          • 4
          • 5
          • 20
          跳至
          / 20 页
          "`; +exports[`ssr snapshot test > renders ./src/pagination/_example/disabled.vue correctly 1`] = `"
          共 100 项数据
          5 条/页
          • 1
          • 2
          • 3
          • 4
          • 5
          • 20
          跳至
          / 20 页
          "`; exports[`ssr snapshot test > renders ./src/pagination/_example/few.vue correctly 1`] = `"
          共 49 项数据
          10 条/页
          • 1
          • 2
          • 3
          • 4
          • 5
          "`; @@ -799,7 +799,7 @@ exports[`ssr snapshot test > renders ./src/select/_example/custom-options.vue co exports[`ssr snapshot test > renders ./src/select/_example/custom-selected.vue correctly 1`] = `"
          选项一(1)选项二(2)选项三(3)
          选项四(4) 选项五(5) 选项六(6) 选项七(7)
          "`; -exports[`ssr snapshot test > renders ./src/select/_example/disabled.vue correctly 1`] = `"
          选项一选项二
          "`; +exports[`ssr snapshot test > renders ./src/select/_example/disabled.vue correctly 1`] = `"
          选项一选项二
          "`; exports[`ssr snapshot test > renders ./src/select/_example/filterable.vue correctly 1`] = `"
          -请选择-
          "`; @@ -825,7 +825,7 @@ exports[`ssr snapshot test > renders ./src/select/_example/scroll-bottom.vue cor exports[`ssr snapshot test > renders ./src/select/_example/size.vue correctly 1`] = `"
          "`; -exports[`ssr snapshot test > renders ./src/select/_example/status.vue correctly 1`] = `"
          "`; +exports[`ssr snapshot test > renders ./src/select/_example/status.vue correctly 1`] = `"
          "`; exports[`ssr snapshot test > renders ./src/select/_example/virtual-scroll.vue correctly 1`] = `"
          "`; @@ -851,7 +851,7 @@ exports[`ssr snapshot test > renders ./src/select-input/_example/multiple.vue co exports[`ssr snapshot test > renders ./src/select-input/_example/single.vue correctly 1`] = `"
          "`; -exports[`ssr snapshot test > renders ./src/select-input/_example/status.vue correctly 1`] = `"
          禁用状态：
          这是禁用状态文本提示
          只读状态：
          这是普通状态的文本提示
          成功状态：
          校验通过文本提示
          警告状态：
          校验不通过文本提示
          错误状态：
          校验存在严重问题文本提示
          "`; +exports[`ssr snapshot test > renders ./src/select-input/_example/status.vue correctly 1`] = `"
          禁用状态：
          这是禁用状态文本提示
          只读状态：
          这是普通状态的文本提示
          成功状态：
          校验通过文本提示
          警告状态：
          校验不通过文本提示
          错误状态：
          校验存在严重问题文本提示
          "`; exports[`ssr snapshot test > renders ./src/select-input/_example/width.vue correctly 1`] = `"
          下拉框默认宽度：
          下拉框最大宽度：
          与内容宽度一致：
          下拉框固定宽度：
          "`; @@ -1087,7 +1087,7 @@ exports[`ssr snapshot test > renders ./src/tag-input/_example/max.vue correctly exports[`ssr snapshot test > renders ./src/tag-input/_example/size.vue correctly 1`] = `"
          VueReact
          VueReact
          VueReact
          "`; -exports[`ssr snapshot test > renders ./src/tag-input/_example/status.vue correctly 1`] = `"
          VueReactMiniprogram
          VueReactMiniprogram
          这是普通文本提示
          VueReactMiniprogram
          校验通过文本提示
          VueReactMiniprogram
          校验不通过文本提示
          VueReactMiniprogram
          校验存在严重问题文本提示
          "`; +exports[`ssr snapshot test > renders ./src/tag-input/_example/status.vue correctly 1`] = `"
          VueReactMiniprogram
          VueReactMiniprogram
          这是普通文本提示
          VueReactMiniprogram
          校验通过文本提示
          VueReactMiniprogram
          校验不通过文本提示
          VueReactMiniprogram
          校验存在严重问题文本提示
          "`; exports[`ssr snapshot test > renders ./src/tag-input/_example/theme.vue correctly 1`] = `"
          VueReactMiniprogram
          VueReactMiniprogram
          VueReactMiniprogram
          VueReactMiniprogram
          "`; @@ -1103,7 +1103,7 @@ exports[`ssr snapshot test > renders ./src/time-picker/_example/base.vue correct exports[`ssr snapshot test > renders ./src/time-picker/_example/clearable.vue correctly 1`] = `"

          具备清空按钮

          禁止清空按钮

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

          禁用整个选择器

          禁用指定时间

          "`; +exports[`ssr snapshot test > renders ./src/time-picker/_example/disabled.vue correctly 1`] = `"

          禁用整个选择器

          禁用指定时间

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