Input component causes warning: "Failed setting prop "size" on <input>: value 0 is invalid"

[keithhchen]

• I have searched the issues of this repository and believe that this is not a duplicate.

Version

3.1.0

Environment

[email protected], [email protected]

Reproduction link

Steps to reproduce

1. Follow "Getting Started" steps to create antd-demo from antdv.com
2. Paste the 1st code example from antdv.com - components - form into App.vue or any SFC

<template>
  <a-form
    :model="formState"
    name="basic"
    :label-col="{ span: 8 }"
    :wrapper-col="{ span: 16 }"
    autocomplete="off"
    @finish="onFinish"
    @finishFailed="onFinishFailed"
  >
    <a-form-item
      label="Username"
      name="username"
      :rules="[{ required: true, message: 'Please input your username!' }]"
    >
      <a-input v-model:value="formState.username" />
    </a-form-item>

    <a-form-item
      label="Password"
      name="password"
      :rules="[{ required: true, message: 'Please input your password!' }]"
    >
      <a-input-password v-model:value="formState.password" />
    </a-form-item>

    <a-form-item name="remember" :wrapper-col="{ offset: 8, span: 16 }">
      <a-checkbox v-model:checked="formState.remember">Remember me</a-checkbox>
    </a-form-item>

    <a-form-item :wrapper-col="{ offset: 8, span: 16 }">
      <a-button type="primary" html-type="submit">Submit</a-button>
    </a-form-item>
  </a-form>
</template>
<script>
import { defineComponent, reactive } from 'vue';
export default defineComponent({
  setup() {
    const formState = reactive({
      username: '',
      password: '',
      remember: true,
    });

    const onFinish = values => {
      console.log('Success:', values);
    };

    const onFinishFailed = errorInfo => {
      console.log('Failed:', errorInfo);
    };

    return {
      formState,
      onFinish,
      onFinishFailed,
    };
  },

});
</script>

3. Check console for warning:

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

4. Downgrading to [email protected] will remove console warning

What is expected?

Input component should work without warning.

What is actually happening?

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

---

Warning only occurs with <a-input>. In the case of textarea (from here), <a-input v-model:value="formState.desc" type="textarea" /> will also produce console warning. Using <a-textarea> instead will not.

This occurs in any version > 3.0.

[Mako-Jin]

I have the same problem
"ant-design-vue": "^3.1.1",
"vue": "^3.2.25",

[yearspark]

我也遇到同样的问题，也是更新到最新版本时候，会出现这个警告

[tangjinzhou]

ref #5177

[IFnGSiYu]

更新了vue也不行

[github-actions]

This issue has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs.