JS.VUE.NO.WATCH.AFTER.AWAIT

Rule Details

This rule reports the watch() after await expression.
In setup() function, watch() should be registered synchronously.

{'vue/no-watch-after-await': ['error']}

<script>
import { watch } from 'vue'
export default {
  async setup() {
    /* GOOD */
    watch(watchSource, () => { /* ... */ })

    await doSomething()

    /* BAD */
    watch(watchSource, () => { /* ... */ })
  }
}
</script>

This rule is not reported when using the stop handle.

{'vue/no-watch-after-await': ['error']}

<script>
import { watch } from 'vue'
export default {
  async setup() {
    await doSomething()

    /* GOOD */
    const stopHandle = watch(watchSource, () => { /* ... */ })

    // later
    stopHandle()
  }
}
</script>

Options

Nothing.

Further Reading

• Guide - Reactivity - Computed and Watch (https://v3.vuejs.org/guide/reactivity-computed-watchers.html)
• Vue RFCs - 0013-composition-api (https://github.com/vuejs/rfcs/blob/master/active-rfcs/0013-composition-api.md)