Subscribe on changes!

when props type is a array includes String and Boolean,order will change the ‘ ’ to true

avatar
Mar 2nd 2021

Version

3.0.7

Reproduction link

https://codesandbox.io/s/strange-shadow-6iepg?file=/src/components/testProps2.vue

Steps to reproduce

Child create a props, if the props's type is a array include 'Boolean,String', and parent's default value is empty string, when Boolean before String ,Child will receive ture not a empty string

What is expected?

[Boolean,String] will not let the empty string transform to the bool true

What is actually happening?

[Boolean,String] will let the empty string transform to the bool true

avatar
Mar 2nd 2021
// [Boolean, String]
prop[BooleanFlags.shouldCast] = booleanIndex > -1
prop[BooleanFlags.shouldCastTrue] =
         stringIndex < 0 || booleanIndex < stringIndex
    // boolean casting
    if (opt[BooleanFlags.shouldCast]) {
      if (!hasOwn(props, key) && !hasDefault) {
        value = false
      } else if (
        opt[BooleanFlags.shouldCastTrue] &&
        (value === '' || value === hyphenate(key))
      ) {
        value = true
      }
    }

it will return true. subject to the first one [Boolean, String][0]

avatar
Mar 2nd 2021
// [Boolean, String]
prop[BooleanFlags.shouldCast] = booleanIndex > -1
prop[BooleanFlags.shouldCastTrue] =
         stringIndex < 0 || booleanIndex < stringIndex
    // boolean casting
    if (opt[BooleanFlags.shouldCast]) {
      if (!hasOwn(props, key) && !hasDefault) {
        value = false
      } else if (
        opt[BooleanFlags.shouldCastTrue] &&
        (value === '' || value === hyphenate(key))
      ) {
        value = true
      }
    }

it will return true. subject to the first one [Boolean, String][0]

你知道為什麼要這樣設計麼?我現在升級原有代碼,這樣我每個地方默認空值只能寫null了,工作量有點多

avatar
Mar 2nd 2021

This is intended because <component someProp="" /> is the same as just <component someProp /> and the order of the array matters. This is also consistent with Vue 2

avatar
Mar 2nd 2021

This is intended because <component someProp="" /> is the same as just <component someProp /> and the order of the array matters. This is also consistent with Vue 2

This is easy to create unexpected bug. Like this => https://github.com/element-plus/element-plus/blob/dev/packages/radio/src/radio-group.vue#L41