map filter 以及过滤数组不同的值

 checkList.value.forEach((item) => { // checkList 是当前选中的字段 通过指定id传给接口 返回的当前角色身份
    res.forEach((item1) => {
      if (item1.title === item) {
        roleArr1.value.push(item1)
      }
    })
  })
  // 去除重复的数据
  const map = new Map()
  const qc = roleArr1.value.filter(   // 因为上一步每一次点击都会添加所以会有很多重复的 需要通过过滤去除重复的数据
    (key) => !map.has(key.id) && map.set(key.id,  1)
  )
  // arrrrr 就是选中的数据 并已经完成了去重
  // 转换成数组
  const arrrrr = []
  qc.forEach((item) => {
    arrrrr.push({ id: item.id, title: item.title, describe: item.describe })
  })
  // 对比两个数组 将数组中没有的值过滤掉 就是删除掉其中一个有数据,另一个没有数据
  // 最终求得结果就是让两个数组根据自己的需求实现一样
  const result = arrrrr.filter((item) => {  // 将最终的数据和checkList 做对比 去除掉cheakList没有的数据 因为checkList的数据时只有checkbox为true是在会添加 false会自动删除
    return checkList.value.some((value) => value === item.title) // 过滤出和checkList不同的数据 以title为过滤条件
  })

上边是优化前
下边是优化后

const res = store.state.roleAndPermission.roles
  // console.log(res)
  // 利用map 返回新数组的方法 获取到当前点击和所有的角色所匹配的身份
  // 并保存在新数组中
  // 之前写的复杂的方法太过于繁琐 所以优化成这种的
  const result = checkList.value.map((item) => { // 直接过滤出不同的数据
    return res.find((key) => key.title === item)
  })