jeecgbootvue2重新整理数组数据或者添加合并数组并遍历背景图片或者背景颜色

想要实现处理后端返回数据并处理,添加已有静态数据并遍历快捷菜单背景图

遍历数组并使用代码

需要注意:

1、静态数组的图片url需要的格式为

javascript 复制代码
require('../../assets/b.png')

2、设置遍历背景图的代码必须是:

javascript 复制代码
:style="{ 'background-image': 'url(' + item.url + ')' }"

处理数据的模块代码为

TypeScript 复制代码
getLoginfoSaveMenu() {
      getCommandsMenuForShortcut().then(response => {
        this.shortcut = response.result.shortcut
        this.shortcut.map(item => {
          this.checkedKeys.push(item.key)
        })
        this.checkeddatas = response.result.shortcut.map((item, index) => {
          return {
            color: this.appList[index % 4].color,//这个为背景颜色使用同背景图
            url: this.appimgs[index % 4].url,//为将静态图片遍历放入穿梭框内
            ...item
          }
        })
        this.targetKeys = this.checkeddatas.map(item => {
          return item.id
        })
      }).catch(error => {
        this.$message.success(error)
      })
    },

获取到的数据类型为

处理后的数据类型为

相关推荐
2301_764441332 分钟前
Python实现深海声弹射路径仿真
python·算法·数学建模
高洁0110 分钟前
DNN案例一步步构建深层神经网络
人工智能·神经网络·算法·机器学习·transformer
式5162 小时前
线性代数(七)主变量与特解
线性代数·算法
业精于勤的牙8 小时前
浅谈:算法中的斐波那契数(二)
算法·职场和发展
不穿格子的程序员9 小时前
从零开始写算法——链表篇4:删除链表的倒数第 N 个结点 + 两两交换链表中的节点
数据结构·算法·链表
liuyao_xianhui9 小时前
寻找峰值--优选算法(二分查找法)
算法
dragoooon349 小时前
[hot100 NO.19~24]
数据结构·算法
电子硬件笔记10 小时前
Python语言编程导论第七章 数据结构
开发语言·数据结构·python
Tony_yitao10 小时前
15.华为OD机考 - 执行任务赚积分
数据结构·算法·华为od·algorithm