当前位置: 首页 > news >正文

(vue)获取对象的键遍历,同时循环el-tab页展示key及内容

(vue)获取对象的键遍历,同时循环el-tab页展示key及内容


效果:
在这里插入图片描述
在这里插入图片描述

数据结构:

"statusData": {"订购广度": [                                  {"id": 11, "ztName": "广",                       ... }, {"id": 12,  "ztName": "较广", ...}, ],"需求强度": [{"id": 21,  "ztName": "强", ...}, {"id": 22,  "ztName": "弱", ...}, ],...}     

代码:

<el-tabs v-model="activeName" @tab-click="handleClick"><el-tab-pane label="状态查看" name="first"><el-tabs type="border-card">// Object.keys(statusData) 获取对象的键(key): ['订购广度', '需求强度', '动销速度', '市场状态', '贡献度', '异常信息']<el-tab-pane :label="item" v-for="(item,index) in Object.keys(statusData)" :key="index"><el-table:data="statusData[item]"...><el-table-column type="index" label="序号" align="center" />...</el-table></el-tab-pane></el-tabs></el-tab-pane><el-tab-pane label="状态编辑" name="second">...</el-tab-pane>
</el-tabs>

相关文章:

(vue)获取对象的键遍历,同时循环el-tab页展示key及内容

(vue)获取对象的键遍历&#xff0c;同时循环el-tab页展示key及内容 效果&#xff1a; 数据结构&#xff1a; "statusData": {"订购广度": [ {"id": 11, "ztName": "广", …...

【严重】Smartbi未授权设置Token回调地址获取管理员权限

漏洞描述 Smartbi是一款商业智能应用&#xff0c;提供了数据集成、分析、可视化等功能&#xff0c;帮助用户理解和使用他们的数据进行决策。 在 Smartbi 受影响版本中存在Token回调地址漏洞&#xff0c;未授权的攻击者可以通过向目标系统发送POST请求/smartbix/api/monitor/s…...

北京鸟巢门票多少,里面有什么好玩的

北京鸟巢门票多少&#xff0c;里面有什么好玩的 北京鸟巢的门票是100元&#xff0c;里面有很多运动设施&#xff0c;“鸟巢”结构设计奇特新颖&#xff0c;而这次搭建它的钢结构的Q460也有很多独到之处&#xff1a;Q460是一种低合金高强度钢&#xff0c;它在受力强度达到460兆帕…...

4路光栅尺磁栅尺编码器5MHz高速差分信号转Modbus TCP网络模块 YL97

特点&#xff1a; ● 光栅尺磁栅尺解码转换成标准Modbus TCP协议 ● 光栅尺5V差分信号直接输入&#xff0c;4倍频计数 ● 模块可以输出5V的电源给光栅尺供电 ● 高速光栅尺磁栅尺计数&#xff0c;频率可达5MHz ● 支持4个光栅尺同时计数&#xff0c;可识别正反转 ● 可网…...

金蝶云星空对接打通旺店通·企业奇门组装拆卸单查询接口与创建其他出库单接口

金蝶云星空对接打通旺店通企业奇门组装拆卸单查询接口与创建其他出库单接口 ​编辑 源系统:金蝶云星空 金蝶K/3Cloud&#xff08;金蝶云星空&#xff09;是移动互联网时代的新型ERP&#xff0c;是基于WEB2.0与云技术的新时代企业管理服务平台。金蝶K/3Cloud围绕着“生态、人人…...

卫星--夏令营

几何问题&#xff1a;就是用几何数学知识解题即可 但是越是数学编程题&#xff0c;越容易忽略数学题中的细节 1.地球半径你算进去了吗? 2.sin三角函数&#xff0c;M_PI标准圆周率在cmath文件里 3.有可能给出的夹角超过180呢&#xff0c;没给数据要求&#xff0c;就要自己考…...

Kafka的下载安装以及使用

一、Kafka下载 下载地址&#xff1a;https://kafka.apache.org/downloads 二、Kafka安装 因为选择下载的是 .zip 文件&#xff0c;直接跳过安装&#xff0c;一步到位。 选择在任一磁盘创建空文件夹&#xff08;不要使用中文路径&#xff09;&#xff0c;解压之后把文件夹内容…...

数据库相关面试题

巩固基础&#xff0c;砥砺前行 。 只有不断重复&#xff0c;才能做到超越自己。 能坚持把简单的事情做到极致&#xff0c;也是不容易的。 mysql怎么优化 : MySQL的优化可以从以下几个方面入手&#xff1a; 数据库设计优化&#xff1a;合理设计表结构&#xff0c;选择合适的数…...

Ubuntu常用配置

文章目录 1. 安装VMware虚拟机软件2. 下载Ubuntu镜像3. 创建Ubuntu虚拟机4. 设置屏幕分辨率5. 更改系统语言为中文6. 切换中文输入法7. 修改系统时间8. 修改锁屏时间9. 通过系统自带的应用商店安装软件10. 安装JDK11. 安装 IntelliJ IDEA12. 将左侧任务栏自动隐藏13. 安装docke…...

win10MySQLServer安装过程+解决MySQL服务无法启动问题

本次使用的版本是 Server version: 8.0.33 MySQL Community Server 安装详解 首先去官网下载社区版&#xff0c;比如我用的是mysql-8.0.33-winx64.zip&#xff0c;解压到文件夹&#xff1a;D:\Program Files\mysql-8.0.33-winx64 用管理员身份运行cmd&#xff0c;进到bin目录…...

网络:CISCO、Huawei、H3C命令对照

思科、华为、锐捷命令对照表 编号思科华为锐捷命令解释1 2writesavesave保存3456 如果你所处的视图为非系统视图&#xff0c;需要查看配置的时候&#xff0c;需要在该配置命令前加do。 在特定的视图之下&#xff0c;有对应的特定命令。例如&#xff0c;在接口视图下的ip addre…...

题目:2319.判断矩阵是否是 X 矩阵

​​题目来源&#xff1a; leetcode题目&#xff0c;网址&#xff1a;2319. 判断矩阵是否是一个 X 矩阵 - 力扣&#xff08;LeetCode&#xff09; 解题思路&#xff1a; 遍历矩阵&#xff0c;对于每一个节点&#xff0c;先判断是否处于主对角线或副对角线上&#xff0c;然后判…...

2023年大厂前端面试题汇总

一、58同城前端面试题27道 1. css盒模型 2. css画三角形 3. 盒子水平垂直居中&#xff08;所有方式&#xff09; 4. 重绘、重排 重绘就是重新绘制&#xff08;repaint&#xff09;&#xff1a;是在一个元素的外观被改变所触发的浏览器行为&#xff0c;浏览器会根据元素的新属性…...

如何在Linux中查找Nginx安装目录

一、通过which命令查找 $ which nginx /usr/sbin/nginxwhich命令会在系统环境变量PATH中查找nginx可执行文件&#xff0c;并返回路径。因此&#xff0c;通过which命令可以很容易地找到系统中nginx的安装位置。 二、通过whereis命令查找 $ whereis nginx nginx: /usr/sbin/ng…...

【NLP】训练LLM的不同方式

一、说明 在大型语言模型&#xff08;LLM&#xff09;领域&#xff0c;有各种各样的 训练机制&#xff0c;具有不同的手段&#xff0c;要求和目标。由于它们服务于不同的目的&#xff0c;因此重要的是不要将它们相互混淆&#xff0c;并了解它们适用的不同场景。 在本文中&#…...

MySQL 45讲笔记(1-10讲)

1. SQL语句如何开始执行&#xff1f; MySQL分为Server和存储引擎两部分&#xff1a; Server层包含连接器、存储缓存、分析器、执行器等&#xff0c;以及所有的内置函数&#xff08;事件、日期&#xff09;等等&#xff0c;还有视图、触发器。 存储引擎是负责数据的存储和提取&a…...

U盘数据如何保密?U盘数据加密软件合集

当我们将重要数据存放在U盘中时&#xff0c;必须要保障U盘的安全&#xff0c;以避免数据泄露。那么&#xff0c;U盘数据该如何保密呢&#xff1f;下面我们就来盘点一下那些好用的U盘数据保护方法。 U盘写保护 起初U盘写保护是专门为U盘防病毒而设计的&#xff0c;写保护后会将…...

此文详解,数据仓库管理建设的经验

目前由于数据分散在不同的存储环境或数据库中&#xff0c;对于新业务需求的开发需要人工先从不同的数据库中同步、集中、合并等处理&#xff0c;造成资源和人力的浪费。同时&#xff0c;目前的系统架构&#xff0c;无法为未来数据驱动业务创新的理念提供友好的支撑。需要建设新…...

01 - 工作区、暂存区、版本库、远程仓库 - 以一次连贯的提交操作为例

查看所有文章链接&#xff1a;&#xff08;更新中&#xff09;GIT常用场景- 目录 文章目录 1. 工作区、暂存区、版本库、远程仓库1.1 工作区1.2 工作区 > 暂存区&#xff1a;git add1.3 暂存区 > 版本库&#xff1a;git commit1.4 push到远程仓库 1. 工作区、暂存区、版本…...

cesium学习记录06-视图、场景与相机

一、视图&#xff08;Viewer&#xff09; viewer是cesium的核心类&#xff0c;是一切的开端。通过new Cesium.Viewer(container, options)来创建一个Viewer对象&#xff0c;而通过这个 Viewer对象&#xff0c;可以添加图层、实体、相机控制等&#xff0c;以及设置一些全局属性…...

第19节 Node.js Express 框架

Express 是一个为Node.js设计的web开发框架&#xff0c;它基于nodejs平台。 Express 简介 Express是一个简洁而灵活的node.js Web应用框架, 提供了一系列强大特性帮助你创建各种Web应用&#xff0c;和丰富的HTTP工具。 使用Express可以快速地搭建一个完整功能的网站。 Expre…...

linux arm系统烧录

1、打开瑞芯微程序 2、按住linux arm 的 recover按键 插入电源 3、当瑞芯微检测到有设备 4、松开recover按键 5、选择升级固件 6、点击固件选择本地刷机的linux arm 镜像 7、点击升级 &#xff08;忘了有没有这步了 估计有&#xff09; 刷机程序 和 镜像 就不提供了。要刷的时…...

3403. 从盒子中找出字典序最大的字符串 I

3403. 从盒子中找出字典序最大的字符串 I 题目链接&#xff1a;3403. 从盒子中找出字典序最大的字符串 I 代码如下&#xff1a; class Solution { public:string answerString(string word, int numFriends) {if (numFriends 1) {return word;}string res;for (int i 0;i &…...

【JavaWeb】Docker项目部署

引言 之前学习了Linux操作系统的常见命令&#xff0c;在Linux上安装软件&#xff0c;以及如何在Linux上部署一个单体项目&#xff0c;大多数同学都会有相同的感受&#xff0c;那就是麻烦。 核心体现在三点&#xff1a; 命令太多了&#xff0c;记不住 软件安装包名字复杂&…...

AI,如何重构理解、匹配与决策?

AI 时代&#xff0c;我们如何理解消费&#xff1f; 作者&#xff5c;王彬 封面&#xff5c;Unplash 人们通过信息理解世界。 曾几何时&#xff0c;PC 与移动互联网重塑了人们的购物路径&#xff1a;信息变得唾手可得&#xff0c;商品决策变得高度依赖内容。 但 AI 时代的来…...

如何更改默认 Crontab 编辑器 ?

在 Linux 领域中&#xff0c;crontab 是您可能经常遇到的一个术语。这个实用程序在类 unix 操作系统上可用&#xff0c;用于调度在预定义时间和间隔自动执行的任务。这对管理员和高级用户非常有益&#xff0c;允许他们自动执行各种系统任务。 编辑 Crontab 文件通常使用文本编…...

从 GreenPlum 到镜舟数据库:杭银消费金融湖仓一体转型实践

作者&#xff1a;吴岐诗&#xff0c;杭银消费金融大数据应用开发工程师 本文整理自杭银消费金融大数据应用开发工程师在StarRocks Summit Asia 2024的分享 引言&#xff1a;融合数据湖与数仓的创新之路 在数字金融时代&#xff0c;数据已成为金融机构的核心竞争力。杭银消费金…...

基于Java+VUE+MariaDB实现(Web)仿小米商城

仿小米商城 环境安装 nodejs maven JDK11 运行 mvn clean install -DskipTestscd adminmvn spring-boot:runcd ../webmvn spring-boot:runcd ../xiaomi-store-admin-vuenpm installnpm run servecd ../xiaomi-store-vuenpm installnpm run serve 注意&#xff1a;运行前…...

c++第七天 继承与派生2

这一篇文章主要内容是 派生类构造函数与析构函数 在派生类中重写基类成员 以及多继承 第一部分&#xff1a;派生类构造函数与析构函数 当创建一个派生类对象时&#xff0c;基类成员是如何初始化的&#xff1f; 1.当派生类对象创建的时候&#xff0c;基类成员的初始化顺序 …...

小木的算法日记-多叉树的递归/层序遍历

&#x1f332; 从二叉树到森林&#xff1a;一文彻底搞懂多叉树遍历的艺术 &#x1f680; 引言 你好&#xff0c;未来的算法大神&#xff01; 在数据结构的世界里&#xff0c;“树”无疑是最核心、最迷人的概念之一。我们中的大多数人都是从 二叉树 开始入门的&#xff0c;它…...