涉及的情况
这种情况 是确保添加的数据和 原数组中结构是
//这里的结构就是实际结构
//这是往里面添加的结构的结构
data:{
item:[{
mag:[{},{},....],
title:''
},
{
mag:[{},{},....],
title:''
},.......]
}
//添加的按数据结构
data:[{},{}]
- 1.借助子组件传值 情况 （弹框是子组件 点击确定 传到 父组件里面）
//子组件
1.保存 点击按钮
<el-button type="primary" @click="save">确 定</el-button>
方法 methods
save() {
this.$emit('tableList', this.list_main)
// 传到父组件 this.list_main： 传到父组件的数据 tableList：点击事件
this.close()
},
//父组件
2.在父组件中引入
import SelectContentEdit from './components/selectContentEdit'
<SelectContentEdit
ref="SelectContentEdit"
:items="form.titleItems"
@tableList="tableList"
></SelectContentEdit>
//@tableList="tableList"：子组件传到父组件里面的 保存的方法
方法 methods
tableList(data) {
this.listLoading = true
console.log(this.flagCount, 'res', data)
// 判断第一次 和之后添加的数据 遍历数组 ids
if (this.flagCount.length) {
// 判断新增的 和之前保存的 是否存在id 一样
for (let i = 0; i < this.flagCount.length; i++) {
let arr = data.find((item) => {
return item.questionId === this.flagCount[i]
})
//如果一样 就说明 存在 提示
if (arr) {
this.$baseMessage('已存在，请重新选择', 'error')
return
}
}
}
// 如果this.flagCount 没有值 就添加
this.form.titleItems.map((item, index) => {
if (index == this.indexCount) {
//这里是添加 传过来的数据
this.form.titleItems[this.indexCount].paperQuestionList.push(
...data
)
let arr = this.form.titleItems[this.indexCount].paperQuestionList
//去重
let newobj = {}
this.form.titleItems[this.indexCount].paperQuestionList =
arr.reduce((preVal, curVal) => {
newobj[curVal.questionId]
? ''
: (newobj[curVal.questionId] = preVal.push(curVal))
return preVal
}, [])
//在每个this.form.titleItems[this.indexCount].paperQuestionList里面去追加
//questionId
this.form.titleItems[this.indexCount].paperQuestionList.forEach(
(item, index) => {
Object.assign(item, { questionId: item.questionId })
}
)
}
})
//刚开始没有数据
//第一次添加时 保存选中的id 放到一个数组里面
let ids = data.map((item) => item.questionId)
//this.flagCount是第一次之后和之后添加的报存在一块并重复去重 用来保存添加id 数组
//在data中定义的
this.flagCount = [...this.flagCount, ...ids]
this.getTotalSore()
setTimeout(() => {
this.listLoading = false
}, 300)
},
待更新。。。
