vue el-form表单嵌套组件时正则校验不生效

上图
组件选中数据，但是正则校验未检测到并且红字提示不会消失。
直接上代码

<template><div class="created_report"><el-form :model="formData" :rules="isRules" ref="formData" label-width="120px"><el-form-item label="接收人：" prop="executive">// 该组件是引用的选人组件<indexBtnComponent v-model="formData.executive" @userChangeHandler="userChangeHandler" />// 重点代码 加入 input 标签 // 第一步<el-input class="input_text input-display-none" ref="input"></el-input></el-form-item></el-form></div>
</template>
<script>
export default {data(){// 自定义校验规则// 第三步var validateUser = (rule, value, callback) => {if (this.formData.executive) {callback();} else {callback(new Error('请选择接收人'));}};return {formData: {executive: '', //接收人},isRules: {// 第二步executive: [{ required: true, validator: validateUser, trigger: ['blur', 'change'] }],},}},methods:{// 在change事件中 给 this.formData.executive  赋值// 可以是change事件 也可以是值改变后会调用的方法 都行// 第四步userChangeHandler(val){this.formData.executive = val// 调用 input 的 获取焦点 和 失去焦点 事件// 重点this.$refs.input.focus();this.$refs.input.blur();},}}
</script>
<style lang="scss" scoped>// 此处隐藏input标签// 第五步.input-display-none{opacity: 0; width: 0; height: 0;position: absolute;}
</style>