Vue version

vue3.3

Link to minimal reproduction

https://codepen.io/xflyyxfl-the-typescripter/pen/poxpwKK

Steps to reproduce

1、把输入框里面的值修改为一个超出1-10范围的数/Edit to a new number out of range 1-10 2、回车触发了watch，检测到输入的值超出了范围，重新设定值/Enter then watch callback reset it to 5 3、template模板里面其它地方确实渲染了重新设定的值，但是该输入框里面的值没有变/Current input dom won't change to 5

What is expected?

v-model.lazy绑定的input即使在焦点状态也要更新其值/v-model.lazy must update the focus dom

What is actually happening?

v-model.lazy绑定的input即使在焦点状态时，它的值与绑定的响应式变量不同/focus inputdom won't update

System Info

Chrome V111.0.5563.111 
edge the same

Any additional comments?

No response

看你的例子，你使用了v-model.lazy, 只有在按回车或者输入框失去聚焦后才会触发watch的

看你的例子，你使用了v-model.lazy, 只有在按回车或者输入框失去聚焦后才会触发watch的

是的，所以呢，是这样不合理吗

你想实时监听就别用lazy呗

你想实时监听就别用lazy呗

我是在正式项目使用中遇到的问题，不使用lazy可能导致逻辑问题。 比如我有个参数输入范围是10-100，用户想输入52，但是在他输第一个5的时候就触发的watch，那么对他的输入检测不合法，强行进行修改。就会导致用户无法输入他想要的值。

你可以不用vmodel跟watch，绑定value跟@Input来判断，或者@change然后逻辑赋值吧

你可以不用vmodel跟watch，绑定value跟@input来判断，或者@change然后逻辑赋值吧

也不是不可以，但是这样肯定是比直接任何地方一个v-model绑定要麻烦。 而且，我这样使用是有什么‘不合理’/‘违反xx原则’/‘故意挠痛点’之类的问题吗 有空了我去扒下原码，看下为什么这样

我在官方源码里面已经找到原因了，但是对于官方尤大这样的选择仍然不太清楚，可能是基于某些需求下的考量： 当某个input用lazy绑定的响应式在变化时，用户如果刚好也在编辑这个输入，那么变化的数据为了不影响用户的编辑，不会主动更新这个值到输入框； 好处是上面的这种情况，以用户输入体验为主。坏处就是当开发者想主动更新时就会发生问题。 示例代码仍然在https://codepen.io/xflyyxfl-the-typescripter/pen/poxpwKK?editors=1010 ///// I have found the reason in the official source code, but it is still not clear for the official/You such choice, may be based on some needs under consideration:

When an input is changing with lazy-bound responses, if the user happens to be editing the input, the changed data will not update the value to the input box so as not to affect the user's editing

The benefit is that in the case above, the user input experience is the primary one. The downside is that problems can occur when developers want to actively update. https://codepen.io/xflyyxfl-the-typescripter/pen/poxpwKK?editors=1010