ElemeFE / element

A Vue.js 2.0 UI Toolkit for Web
https://element.eleme.io/
MIT License
54.12k stars 14.64k forks source link

[Bug Report] Form resetFields out of expectation #21349

Open preflower opened 3 years ago

preflower commented 3 years ago

Element UI version

2.15.6

OS/Browsers version

93

Vue version

2.6.14

Reproduction Link

https://codepen.io/preflower/pen/dyRwzEV

Steps to reproduce

  1. input datepicker and select value
  2. click reset button to clear form

What is Expected?

after resetFields be triggered, conditions.date return undefined

What is actually happening?

conditions.date return [undefined]

preflower commented 3 years ago

当我查看resetField实现的时候,我无法理解源码里为什么对数组类型特殊对待

if (Array.isArray(value)) {
  prop.o[prop.k] = [].concat(this.initialValue);
} else {
  prop.o[prop.k] = this.initialValue;
}

这个特殊对待导致了resetFields反馈不符合预期

shileiyuan commented 2 years ago

I think the initialValue of datetimerange should be an Array, then it's consistent with the result after you invoke resetFields.

preflower commented 2 years ago

I think the initialValue of datetimerange should be an Array, then it's consistent with the result after you invoke resetFields.

i agree this that ask for default value should be array, but now is a bug because not ask for default type;

and i don't understand why reset in the source code needs to judge array type(it's used for fix other bugs?), it should be reset to the value that i pass

shileiyuan commented 2 years ago

I don't think it's a bug, the behavior is designed to be. In fact, you shouldn't pass a value whose type is not Array to datetimerange although it doesn't throw an error. Because it needs an Array, and when you change its value, it also emits an Array. When you call resetField, the ElFormItem just changes your initialValue to an Array to keep consistent with the datetimerange.

preflower commented 2 years ago

I don't think it's a bug, the behavior is designed to be. In fact, you shouldn't pass a value whose type is not Array to datetimerange although it doesn't throw an error. Because it needs an Array, and when you change its value, it also emits an Array. When you call resetField, the ElFormItem just changes your initialValue to an Array to keep consistent with the datetimerange.

output error or warning if shouldn't pass not array value, but nothing

Krue1 commented 2 years ago

同样有这个问题,当我想使用时间范围组件的时候,虽然照理说应该是一个数组类型的,但resetFields返回的结果却是一个有一项空字符串的数组

LingHanChuJian commented 1 year ago

同样有这个问题,当我想使用时间范围组件的时候,虽然照理说应该是一个数组类型的,但resetFields返回的结果却是一个有一项空字符串的数组

确实遇到了, el-select 多选重置表单后出现 空字符串数组 [''] prop.o[prop.k] = [].concat(this.initialValue) 如果改成 Array.from(this.initialValue) 会不会好一点