[Vue warn]: Invalid prop: type check failed for prop "checked". Expected Boolean, got Event #1356
Description
- I have searched the issues of this repository and believe that this is not a duplicate.
Version
1.4.2
Environment
Win 10 1903, Chrome 78, vue ^2.6.10
Reproduction link
https://github.com/liudonghua123/antd-demo
Steps to reproduce
- vue create antd-demo
- vue add ant-design
- write a component mixed v-decorator and v-model like the following.
// FormDemo.vue
<template>
<a-form :form="form">
<a-form-item
:label-col="formItemLayout.labelCol"
:wrapper-col="formItemLayout.wrapperCol"
label="Name"
>
<a-input
v-decorator="[
'username',
{ rules: [{ required: true, message: 'Please input your name' }] }
]"
placeholder="Please input your name"
/>
</a-form-item>
<a-form-item
:label-col="formItemLayout.labelCol"
:wrapper-col="formItemLayout.wrapperCol"
label="Nickname"
>
<a-input
v-decorator="[
'nickname',
{
rules: [
{ required: checkNick, message: 'Please input your nickname' }
]
}
]"
placeholder="Please input your nickname"
/>
</a-form-item>
<a-form-item
:label-col="formTailLayout.labelCol"
:wrapper-col="formTailLayout.wrapperCol"
>
<a-checkbox v-model="checkNick">
Nickname is required
</a-checkbox>
</a-form-item>
<a-form-item
:label-col="formTailLayout.labelCol"
:wrapper-col="formTailLayout.wrapperCol"
>
<a-button type="primary" @click="check">
Check
</a-button>
</a-form-item>
</a-form>
</template>
<script>
const formItemLayout = {
labelCol: { span: 4 },
wrapperCol: { span: 8 }
};
const formTailLayout = {
labelCol: { span: 4 },
wrapperCol: { span: 8, offset: 4 }
};
export default {
data() {
return {
checkNick: false,
formItemLayout,
formTailLayout,
form: this.$form.createForm(this, { name: "dynamic_rule" })
};
},
methods: {
check() {
this.form.validateFields(err => {
if (!err) {
// console.info("success");
}
});
},
}
};
</script>
- Use the component in App.vue
- Click the checkbox in the browser page
What is expected?
No warn or error shown in console
What is actually happening?
The callback in model is called twice, the first one the value argument was a event object, the the second one with the correct true/false value.