关于el-form表单提交图片问题

Question

关于传给后台数据，我是要将表单数据和照片信息一起发给后台，因为想使用axios通信，所以在beforeUpload中设置，但是打印数据，传过去的应该是一个空的对象，我该怎么把整个表单的数据和图片一起传过去呢，现在我是：data在el-load中，我该怎么把数据传到beforeUpload中呢（我不确定beforeUpload（file）中的这个file是什么）
`<template>

<div>
    <div class="upload-image">
        <el-form :model="ruleForm" :rules="rules" ref="ruleForm" label-width="100px">
            <el-form-item label="姓名" prop="name">
                <el-input v-model="ruleForm.name" style="width: 300px"></el-input>
            </el-form-item>
            <el-form-item label="手机号" prop="phone">
                <el-input v-model="ruleForm.phone" style="width: 300px"></el-input>
            </el-form-item>
            <el-form-item label="上传图片" ref="uploadElement" prop="imageUrl">
                <el-input v-model="ruleForm.imageUrl" v-if="false"></el-input>
                <el-upload
                        name="file"
                        class="avatar-uploader"
                        ref="upload"
                        :show-file-list="false"
                        action="aaa"
                        :before-upload="beforeUpload"
                        :on-change="handleChange"
                        :auto-upload="false"
                        :data="ruleForm">
                    <img v-if="ruleForm.imageUrl" :src="ruleForm.imageUrl" class="avatar">
                    <i v-else class="el-icon-plus avatar-uploader-icon"></i>
                </el-upload>
            </el-form-item>
            <el-form-item>
                <el-button type="primary" @click="submitForm('ruleForm')">立即创建</el-button>
                <el-button @click="resetForm('ruleForm')">重置</el-button>
            </el-form-item>
        </el-form>
    </div>
</div>

</template>

<script>
export default {

data(){
    return{
        ruleForm: {
            name: '',
            imageUrl: '',
        },
        rules: {
            name: [
                {required: true, message: '请输入姓名', trigger: 'blur'},
            ],
            phone: [
                {required: true, message: '请输入手机号', trigger: 'blur'},
            ],
            imageUrl: [
                {required: true, message: '请上传图片', trigger: 'blur'},
            ],
        }
    }
},

 methods: {
    submitForm(formName) {
        //let vm = this;
        this.$refs[formName].validate((valid) => {
            if (valid) {
                this.$refs.upload.submit();
            } else {
                this.$notify({
                type: "error",
                message: '注册失败'
                });
                return false;
            }
        });
    },
    resetForm(formName) {
        this.$refs[formName].resetFields();
        this.ruleForm.imageUrl = '';
    },

    handleChange (file, fileList) {
        this.ruleForm.imageUrl = URL.createObjectURL(file.raw);
    },

    beforeUpload(file) {
        let registeData = new FormData()
        registeData.append('file', file)
        console.log(registeData)
        this.$axios.params.params.registFace(this.registeData).then(res=>{
            console.log(res.data)
        })
        return false
    },
}

}
</script>

<style lang="less" scoped>

.avatar-uploader .el-upload {
    border: 1px dashed #d9d9d9;
    border-radius: 6px;
    cursor: pointer;
    position: relative;
    overflow: hidden;
}

.avatar-uploader .el-upload:hover {
    border-color: #409EFF;
}

.avatar-uploader-icon {
    font-size: 28px;
    color: #8c939d;
    width: 178px;
    height: 178px;
    line-height: 178px;
    text-align: center;
}

.avatar {
    width: 178px;
    height: 178px;
    display: block;
}

</style>`