Version

3.2.33

Reproduction link

https://sfc.vuejs.org/

Steps to reproduce

<template>
  <input v-bind="props" />
</template>

<script setup>
const props = defineProps({
  size: Number,
})
console.log('props', props)
</script>

What is expected?

do not print warnings

What is actually happening?

[Vue warn]: Failed setting prop "size" on : value 0 is invalid. Error: Failed to set the 'size' property on 'HTMLInputElement': The value provided is 0, which is an invalid size.

same problem as #5734

This is native behavior:

Your props object has a property of size being undefined so it sets it and it produces that warning. Ensure the object passed to v-bind has a correct size property.

See issues like https://github.com/vuejs/core/issues/3576

Yeah~I know that, but shouldn't it be ignored if the property's value is undefined? Because a property with value undefined has no meaning

No, because some DOM properties could be expecting undefined as a possible value. You can and probably should reformat the object passed to v-bind in order to ensure valid values. As an example: you wouldn't pass :size="size" if size could be null or 0.

You can force it as an attribute to remove it though.

Thanks! I didn't know has .attr modifier