## 前因 环境 Vue3 + typescript + ant-design-vue 2.0 ```vue // 父组件 ``` 这样写标题是起作用的,而封面的表单验证没有起作用,并且控制台会报出一个警告 ![](http://stg.iobs.pingan.com.cn/download/icore-aops-dmz-stg/portal-icore-apps-content-1614671397961-D9E2555D23F44A10A6572DE7DDFAF734-92331884) ## 解决 搞了很久都不知道是为什么,我一直以为`themeImgs: [{ required: true, message: '请上传封面', trigger: 'change' }]`是会监听 themeImgs 这个变量的变化,从而触发校验,后来了解原理之后才知道,这样写,它会在组件上绑定一个change事件,第一个标题的校验没问题是因为 Input 有内部会触发 blur 方法,所以我只需要在我的 子组件里面也触发 change 方法就行了,这样改了之后发现警告还是存在,后面想到我是这样写的 ```vue // 子组件 ``` 里面也有change事件,两者冲突了,所以我只需要在template之下加一个根 div 就行了 ```vue // 子组件 ``` 这样就没问题了 *参考资料* 1.[element ui form 验证机制](https://blog.csdn.net/weixin_36878452/article/details/89010829)