Browse Source

feat(watch): warn when using lazy with simple callback

Evan You 6 năm trước cách đây
mục cha
commit
3deb20df63

+ 5 - 2
packages/runtime-core/__tests__/apiWatch.spec.ts

@@ -1,5 +1,5 @@
 import { watch, reactive, computed, nextTick, ref, h } from '../src/index'
-import { render, nodeOps, serializeInner } from '@vue/runtime-test'
+import { render, nodeOps, serializeInner, mockWarn } from '@vue/runtime-test'
 import {
   ITERATE_KEY,
   DebuggerEvent,
@@ -10,6 +10,8 @@ import {
 // reference: https://vue-composition-api-rfc.netlify.com/api.html#watch
 
 describe('api: watch', () => {
+  mockWarn()
+
   it('basic usage', async () => {
     const state = reactive({ count: 0 })
     let dummy
@@ -344,7 +346,7 @@ describe('api: watch', () => {
     expect(cb).toHaveBeenCalled()
   })
 
-  it('ignore lazy', async () => {
+  it('ignore lazy option when using simple callback', async () => {
     const count = ref(0)
     let dummy
     watch(
@@ -354,6 +356,7 @@ describe('api: watch', () => {
       { lazy: true }
     )
     expect(dummy).toBeUndefined()
+    expect(`lazy option is only respected`).toHaveBeenWarned()
 
     await nextTick()
     expect(dummy).toBe(0)

+ 10 - 3
packages/runtime-core/src/apiWatch.ts

@@ -29,6 +29,7 @@ import {
 } from './errorHandling'
 import { onBeforeUnmount } from './apiLifecycle'
 import { queuePostRenderEffect } from './renderer'
+import { warn } from './warning'
 
 export type WatchHandler<T = any> = (
   value: T,
@@ -197,14 +198,20 @@ function doWatch(
     scheduler: applyCb ? () => scheduler(applyCb) : scheduler
   })
 
-  if (!lazy || !cb) {
+  if (lazy && cb) {
+    oldValue = runner()
+  } else {
+    if (__DEV__ && lazy && !cb) {
+      warn(
+        `watch() lazy option is only respected when using the ` +
+          `watch(getter, callback) signature.`
+      )
+    }
     if (applyCb) {
       scheduler(applyCb)
     } else {
       scheduler(runner)
     }
-  } else {
-    oldValue = runner()
   }
 
   recordEffect(runner)