watch callback has something side effect when calling createApp in the callback

[deot]

Vue version

3.2.39

Link to minimal reproduction

SFC Playground

Steps to reproduce

1. Open the demo@vue3.2.39
2. After clicking it, log 1,1,2,2 will appear

What is expected?

1. open the demo@vue3.2.37
2. After clicking it, log 1,2,1,2 will appear

What is actually happening?

Log: 1, 1, 2, 2

System Info

No response

Any additional comments?

No response

[deot]

A new problem after #6614 fixed

[zhangzhonghe]

Workaround:

watch(
  () => isActive.value,
  (v) => {
    if (v) {
     loadData()
    }
  },
  // use post
  { flush: 'post' }
)

[weidehai]

Workaround:

watch(
  () => isActive.value,
  (v) => {
    if (v) {
     loadData()
    }
  },
  // use post
  { flush: 'post' }
)

this workaround seems no work，vue will flush pre end post job when render a new component in vue 3.2.39

[jh-leong]

As a workaround, use a sync flush watcher:

watch(
  () => isActive.value,
  v => {
    // ...
  },
  { flush: 'sync' }
)