Jelajahi Sumber

preserve reactivity for initially invalid props (close #2580)

Evan You 10 tahun lalu
induk
melakukan
0e8e40ae06
2 mengubah file dengan 16 tambahan dan 12 penghapusan
  1. 15 11
      src/compiler/compile-props.js
  2. 1 1
      src/directives/internal/prop.js

+ 15 - 11
src/compiler/compile-props.js

@@ -224,9 +224,10 @@ export function initProp (vm, prop, value) {
   if (value === undefined) {
     value = getPropDefaultValue(vm, prop.options)
   }
-  if (assertProp(prop, value)) {
-    defineReactive(vm, key, value)
+  if (!assertProp(prop, value, vm)) {
+    value = undefined
   }
+  defineReactive(vm, key, value)
 }
 
 /**
@@ -265,9 +266,10 @@ function getPropDefaultValue (vm, options) {
  *
  * @param {Object} prop
  * @param {*} value
+ * @param {Vue} vm
  */
 
-export function assertProp (prop, value) {
+export function assertProp (prop, value, vm) {
   if (
     !prop.options.required && ( // non-required
       prop.raw === null ||      // abscent
@@ -304,20 +306,22 @@ export function assertProp (prop, value) {
     }
   }
   if (!valid) {
-    process.env.NODE_ENV !== 'production' && warn(
-      'Invalid prop: type check failed for ' +
-      prop.path + '="' + prop.raw + '".' +
-      ' Expected ' + formatType(expectedType) +
-      ', got ' + formatValue(value) + '.'
-    )
+    if (process.env.NODE_ENV !== 'production') {
+      warn(
+        'Invalid prop: type check failed for prop "' + prop.name + '"' +
+        (vm.$options.name ? ' on component <' + hyphenate(vm.$options.name) + '>.' : '.') +
+        ' Expected ' + formatType(expectedType) +
+        ', got ' + formatValue(value) + '.'
+      )
+    }
     return false
   }
   var validator = options.validator
   if (validator) {
     if (!validator(value)) {
       process.env.NODE_ENV !== 'production' && warn(
-        'Invalid prop: custom validator check failed for ' +
-        prop.path + '="' + prop.raw + '"'
+        'Invalid prop: custom validator check failed for prop "' + prop.name + '"' +
+        (vm.$options.name ? ' on component <' + hyphenate(vm.$options.name) + '>.' : '.')
       )
       return false
     }

+ 1 - 1
src/directives/internal/prop.js

@@ -28,7 +28,7 @@ export default {
       parentKey,
       function (val) {
         val = coerceProp(prop, val)
-        if (assertProp(prop, val)) {
+        if (assertProp(prop, val, child)) {
           if (isSimple) {
             withoutConversion(() => {
               child[childKey] = val