watch and props changes are not in an update queue

[tangjinzhou]

Version

3.0.0-beta.18

Reproduction link

https://jsbin.com/daxofotupi/edit?html,console,output

Steps to reproduce

input some characters and view the log, it will trigger two updates.

What is expected?

trigger one update

What is actually happening?

trigger two updates

[tangjinzhou]

There is no problem for most scenes, but when using input, you will not be able to input Chinese like https://jsbin.com/neyuqekusi/edit?html,console,output .

[yyx990803]

The watcher is triggered during the update of the child component itself and queued after. You can use a sync watcher:

  watch: {
    value: {
      handler(val) {
        console.log('watch value change')
        this.stateValue = val;
      },
      flush: 'sync'
    }
  }

Or, even better, use a computed instead of a watcher.