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)
      })
    },

获取到的数据类型为

处理后的数据类型为

相关推荐
✿ ༺ ོIT技术༻18 分钟前
剑指offer第2版:动态规划+记忆化搜索
算法·动态规划·记忆化搜索
oioihoii42 分钟前
C++11标准库算法:深入理解std::none_of
java·c++·算法
老虎06271 小时前
数据结构(Java)--位运算
java·开发语言·数据结构
karmueo463 小时前
视频序列和射频信号多模态融合算法Fusion-Vital解读
算法·音视频·多模态
小汉堡编程4 小时前
数据结构——vector数组c++(超详细)
数据结构·c++
写代码的小球6 小时前
求模运算符c
算法
雾里看山8 小时前
顺序表VS单链表VS带头双向循环链表
数据结构·链表
大千AI助手10 小时前
DTW模版匹配:弹性对齐的时间序列相似度度量算法
人工智能·算法·机器学习·数据挖掘·模版匹配·dtw模版匹配
好好研究10 小时前
学习栈和队列的插入和删除操作
数据结构·学习