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>
