[Dialog] 如果form-item 只有一个的话 错误信息 显示不出来

[Jiachang-Cai]

tdesign-vue 版本

0.46.4

重现链接

https://stackblitz.com/edit/angular-p4hgch?file=src/demo.vue

重现步骤

期望结果

显示表单验证错误信息

实际结果

没有显示 高度不够？

框架版本

No response

浏览器版本

No response

系统版本

No response

Node版本

No response

补充说明

No response

[github-actions[bot]]

👋 @Jiachang-Cai，感谢给 TDesign 提出了 issue。 请根据 issue 模版确保背景信息的完善，我们将调查并尽快回复你。

[github-actions[bot]]

♥️ 有劳 @zhaodanchun @chaishi @zack921 @huoyuhao 尽快确认问题。 确认有效后将下一步计划和可能需要的时间回复给 @Jiachang-Cai 。

[sagittarius-rev]

问题原因分析

表单项目原先设置了底部边距

.t-form__item.t-form__item-with-extra {
    margin-bottom: 24px;
}

.t-form__item {
    margin-bottom: 24px;
}

但对于表单的最后一个项目，有个额外的样式覆盖了默认样式

.t-form:not(.t-form-inline) .t-form__item:last-of-type {
    margin: 0;
}

表单最后一个项目的底部外边距变成了 0 。

这样，表单在对话框内显示时，对话框高度自适应，留出的高度就会不足。表单最后一项如果验证错误，则会让对话框出现纵向滚动条。也就是，如果不进行纵向滚动，就看不到最后一项的错误信息。

[Simon-He95]

@sagittarius-rev 在"tdesign-vue": "1.1.1"版本这个问题已经被修复了

[chaishi]

这个问题在最新的版本号中已经不存在，see https://stackblitz.com/edit/angular-p4hgch-xnpsyx?file=src%2Fdemo.vue