search

kazupon / vue-validator

:white_check_mark: Validator component for Vue.js
MIT License
2.19k stars 431 forks source link

Duplicate async validate #238

Closed erguotou520 closed 8 years ago

erguotou520 commented 8 years ago

vue & vue-validator version

vue: 1.0.24 vue-validator: 2.1.1

Reproduction Link

https://jsfiddle.net/kvmrLvw9/1/

Steps to reproduce

The $data.validators.exist function called again while the data not changed, and we can't judge whether the input value is modified. So this will call a duplicated ajax validation.

What is Expected?

If the field not changed, do not call the function again or we can judge whether it is modified.

kazupon commented 8 years ago

Thank you for your reporting!!

You can avoid this issue with detect-blur="off".

erguotou520 commented 8 years ago

Ok, got it.

erguotou520 commented 8 years ago

It will also disable the touched state if add the detect-blur attr, this is not good. I still need the dirty, modified, touched check.

kazupon commented 8 years ago

The vue-validator should not disable the touched because occur runtime error when is re-rendering if use the touched in the template. The other is the same.

erguotou520 commented 8 years ago

So when set detect-blur="off" the $validation.touched will be always false?

kazupon commented 8 years ago

yeah! the $validation.touched become always false

erguotou520 commented 8 years ago

It's not well I think.

kazupon commented 8 years ago

Why do you think incorrect about it ? Please tell me detail explanation.

erguotou520 commented 8 years ago

If the error text dom wrote like this <span v-show="$validation.foo.touched&&$validation.foo.exist">It is existed, please try another one.</span>, and exist validation is a async check function which check the field's value is existed.
So when users focus on the input, typed something and then blur, then focus then blue which nothing typed, you will find there are two duplicated exist check. This is not I want. The better way is when input field value is valid then do async check. And duplicated value again? No check again.