type check failed for prop "model". Expected Object, got Array

Question

vue.runtime.esm.js?0261:619 [Vue warn]: Invalid prop: 

found in

---> <ElForm> at packages/form/src/form.vue
       <Previewexam> at src/views/exam/PreviewExam.vue
         <TopNav> at src/components/TopNav.vue
           <App> at src/App.vue
             <Root>

这种报错怎么查啊？
页面里面就只有一个model我还专门打印了一下，就是对象啊。不是数组。不知道怎么查了

代码：

<template>

<div class="examdetails">
    <div class="examdetailsBox">
        <el-form :model="ruleForm" status-icon :rules="rules" ref="ruleForm" label-width="100px"
                 class="demo-ruleForm">
            <el-form-item label="试卷名:">
                <span>{{ruleForm.description}}</span>
            </el-form-item>
            <el-form-item label="试卷说明:">
                <span>本试卷是由单选题、多选题、判断题、填空题、问答题五类大题组成，共？题，共？分，考试用时？分钟</span>
            </el-form-item>
            <div>
                <p><span>试卷名:</span><span>{{ruleForm.name}}</span></p>
                <p><span>是否私有：</span><span>{{ruleForm.personal}}</span></p>
            </div>
            <el-form-item>
                <el-button type="primary" @click="AddTopicToExam">继续添加题目到本试卷AddTopicToExam</el-button>
                <el-button type="primary" @click="handleEdit">编辑试卷基本信息EditExam</el-button>
                <el-button type="danger" @click="handleDelete">删除试卷</el-button>
            </el-form-item>
            <el-form-item>
                <h2> label="一、单选题:"</h2>
                <ol>
                    <li v-for="(item,index) in ruleForm.singleChoiceData" :key="index">
                        <p>{{item.question}}</p>
                        <p>{{item.answer}}</p>
                    </li>
                </ol>
            </el-form-item>

            <el-form-item>{{ruleForm.tip}}</el-form-item>
            <el-form-item>
                <el-button type="primary" @click="confirm('ruleForm')">交卷</el-button>
                <el-button>取消</el-button>
            </el-form-item>
        </el-form>
    </div>
</div>

</template>

<script>

import global from "../../Global";

export default {
    name: "previewexam",
    data() {
        return {
            ruleForm: {
                topics: {
                    singleChoiceData:
                        [{
                            id: '',
                            question: '',//问题
                            answer: '',//答案
                            type: '',//题目类型
                            score: '',//分值（我们约定，分值范围是1-5）
                            time: '',//建议⽤时，秒
                        }]

                },
                id: '',
                name: '',//试卷名
                examId: '',
                // selectTopicIds: [],
                personal: '',
                tip: '~~~',
                search: '',
                // multipleSelection: [],
                pageNum: 1,
                pageSize: 10,
                total: 0,
            },
            rules: {
                // knowledgePoints: [
                //     {required: true, message: '请输入知识点', trigger: 'blur'},
                //     {min: 2, max: 100, message: '长度在 2 到 100 个字符'}
                // ],
                // questionType: [
                //     {required: true, message: '请选择题目类型', trigger: 'change'},
                // ],
                // questionBankClassification: [
                //     {required: true, message: '请选择题目类别', trigger: 'change'},
                // ],
            }
        }
    },
    methods: {
        confirm(formName) {
            this.$refs[formName].validate((valid) => {
                if (valid) {
                    console.log(this.ruleForm);
                    let formdata = new FormData();
                    formdata.append('knowledgePoints', this.ruleForm.knowledgePoints);
                    formdata.append('questionTypes', this.ruleForm.questionTypes);
                    formdata.append('questionBankClassification', this.ruleForm.questionBankClassification);
                    this.$axios.post("/user/createtopic", formdata).then(response => {
                        if (response.data.success) {
                            this.ruleForm.tip = "题目创建成功，即将跳转到试卷库中心......";
                            // setTimeout("javascript:location.href='/personalCenter.html'", 1000);
                        } else {
                            this.ruleForm.tip = "题目创建失败: " + response.data.msg;
                        }
                        console.log(response);
                        console.log(response.data);
                        // console.log('修改成功!');
                    }).catch(function (error) {
                        console.log("*************");
                        console.log(error);
                    })
                } else {
                    this.ruleForm.tip = '请补充完整!!';
                    console.log('请补充完整!!');
                    return false;
                }
            });
        },
        AddTopicToExam() {
            this.$router.push({path: '/addtopictoexam'});
        },
        handleEdit() {
            this.$router.push({path: '/editexam'});
        },
        //删除试卷
        handleDelete() {
            //先确认一下是否删除
            this.$confirm('此操作将永久删除该文件, 是否继续?', '提示', {
                confirmButtonText: '确定',
                cancelButtonText: '取消',
                type: 'warning'
            }).then(() => {
                console.log("试卷编号是examId===" + localStorage.getItem("examId"));
                let formdata = new FormData();
                formdata.append('id', localStorage.getItem("examId"));
                this.$axios.post("/exam/deleteExam", formdata).then(response => {
                    console.log("response.data" + response.data);
                    if (response.data.status === global.responseCode.OK) {
                        console.log("删除成功！");
                    } else {
                        console.log("删除失败： " + response.data.msg);
                    }
                }).catch(function (error) {
                    console.log(error);
                });
                this.$message({
                    type: 'success',
                    message: '删除成功!'
                });
            }).catch(() => {
                this.$message({
                    type: 'info',
                    message: '已取消删除'
                });
            });
        },
        //把题目类型中英文切换来显示
        typeNameTranslation(typeName) {
            //验证是否是中文
            let patternCN = new RegExp("[\u4E00-\u9FA5]+");
            let patternEN = new RegExp("[A-Za-z]+");

            var str = typeName.trim();
            if (patternCN.test(str)) {
                console.log('该字符串是中文');
                if (typeName === '单选题') {
                    typeName = 'SINGLE_CHOICE';
                } else if (typeName === '多选题') {
                    typeName = 'MULTIPLE_CHOICE';
                } else if (typeName === '判断题') {
                    typeName = 'JUDGE';
                } else if (typeName === '填空题') {
                    typeName = 'COMPLETION';
                } else if (typeName === '问答题') {
                    typeName = 'QUESTION_AND_ANSWER';
                }
            }
            //验证是否是英文
            if (patternEN.test(str)) {
                //console.log('该字符串是英文');
                if (typeName === 'SINGLE_CHOICE') {
                    typeName = '单选题';
                } else if (typeName === 'MULTIPLE_CHOICE') {
                    typeName = '多选题';
                } else if (typeName === 'JUDGE') {
                    typeName = '判断题';
                } else if (typeName === 'COMPLETION') {
                    typeName = '填空题';
                } else if (typeName === 'QUESTION_AND_ANSWER') {
                    typeName = '问答题';
                }
            }
            return typeName;
        }
        ,
        getData() {
            console.log("试卷编号是：id==" + localStorage.getItem("examId"));
            this.$axios.get("/exam/findExamById", {params: {id: localStorage.getItem("examId")}}).then(response => {
                console.log(response.data.result);
                if (response.data.result) {
                    this.ruleForm = response.data.result.topics;
                    console.log(typeof this.ruleForm);
                    var arr = response.data.result.topics;
                    this.ruleForm.topics = arr.map(item => {
                        return {
                            id: item.id,
                            description: item.description,
                            question: item.question,
                            type: this.typeNameTranslation(item.type),
                            categories: item.categories,
                            score: item.score,
                            time: item.time,
                            createTime: item.createTime,
                        };
                    });
                    this.ruleForm.total = response.data.result.total;
                    this.ruleForm.name = response.data.result.name;
                    this.ruleForm.personal = response.data.result.personal;
                    localStorage.setItem("examIsPersonal", this.personal);
                    this.ruleForm.singleChoiceData = arr.filter(item => {
                        return item.type === 'SINGLE_CHOICE';
                    });

                    // console.log(response.data.result.topics.singleChoiceData);
                    console.log(this.ruleForm.singleChoiceData);
                    console.log(typeof this.ruleForm.singleChoiceData);
                    console.log("等到这个页面的数据多了之后，需要再检查一下分页是否正常！");
                } else {
                    console.log("获取题目信息失败： " + response.data.msg);
                }
            }).catch(function (error) {
                console.log(error);
            })
        }
    },
    created() {
        this.examId = localStorage.getItem("examId");
        this.getData();
    }
}

</script>

<style scoped>

</style>

Answer 1

你写的很清楚了啊，prop model类型检查错误，期望是个Object，但是传的是Array。

Answer 2

可以参考一下这个https://segmentfault.com/a/11...