loading

Subject List 组件

SubjectList 组件用于管理和展示一系列的题目，包括单选题、多选题、排序题、填空题和量表题。该组件提供了添加、删除、移动和保存题目的功能。

---

基础用法

loading

---

属性

属性名	类型	默认值	说明
subjectList	Array	[]	题目列表
isPreview	Boolean	false	是否为预览模式

---

事件

事件名	参数	说明
save	(index: number, item: any)	保存题目事件
edit	(index: number)	编辑题目事件
delete	(index: number)	删除题目事件
move	`(index: number, type: 'up'	'down')`
add	(type: string, index: number)	添加题目事件

---

方法

添加题目

使用 addSubject 方法可以在指定位置添加新题目。

function addSubject(type: string, index: number | null = null) {
  const newSubject = {
    answerType: type,
    analysis: '',
    scaleQuestionList: [],
    isSave: false,
    isEdit: true,
    isRealCanDel: true,
    hasSet: false,
  }

  if (index !== null) {
    currentList.value.splice(index + 1, 0, newSubject)
  }
  else {
    currentList.value.push(newSubject)
  }
}

---

删除题目

使用 deleteSubject 方法可以删除指定索引的题目。

function deleteSubject(index: number) {
  currentList.value.splice(index, 1)
  ElMessage.success('删除成功')
}

---

移动题目

使用 move 方法可以上下移动题目。

function move(index: number, type: 'up' | 'down') {
  if (type === 'up' && index > 0) {
    const [item] = currentList.value.splice(index, 1)
    currentList.value.splice(index - 1, 0, item)
  }
  else if (type === 'down' && index < currentList.value.length - 1) {
    const [item] = currentList.value.splice(index, 1)
    currentList.value.splice(index + 1, 0, item)
  }
}

---

保存题目

使用 saveSubject 方法可以保存指定索引的题目。

function saveSubject(index: number, item: any) {
  currentList.value[index] = {
    ...currentList.value[index],
    ...item,
    isEdit: false,
  }
}

---

示例

添加题目

addSubject('single', 0) // 在索引 0 后添加单选题
addSubject('multiple') // 在末尾添加多选题

删除题目

deleteSubject(1) // 删除索引为 1 的题目

移动题目

move(2, 'up') // 将索引为 2 的题目上移
move(0, 'down') // 将索引为 0 的题目下移

保存题目

saveSubject(0, { title: '更新后的题目标题' }) // 保存索引为 0 的题目