vue3前端解析大数据返给的数据格式

  • # xxx:111111111111111\n\n## 2222:\n- 99999999。\n- 564566556。\n- ", 
npm install marked
import {marked} from 'marked'marked(# xxx:111111111111111\n\n## 2222:\n- 99999999。\n- 564566556。\n-)//就可以解析成 《p》 <li>标签  
//  <span class="f-s-14" v-html="a"></span>

 第二种就是 直接返给JSON串,前端动态渲染

 

{ "你好": { "我有": "100%", "一个": "20%", "帽衫": "20%", "我要在": "20%", "网上问问": "20%", "穿上之后": "20%", "显得": "20%" }, "很忠诚": "42.86%" }

    let data =  数据['你好']const arr = ref<string[]>([])for (const key in data) {if (Object.prototype.hasOwnProperty.call(data, key)) {arr.value.push(`${key}: ${data[key]}`)console.log(`${key}: ${data[key]}`);}}console.log(arr.value)//或者是 直接循环对象<div class="f-s-14 detail m-b-10" v-for="(value,key) in basic.executeRateContent['你好']" :key="key"><el-image :src="Ask" class="error-img"></el-image><div>{{key}}-{{value}}</div></div>

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/bicheng/36599.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

TextField是用于在用户界面中输入文本的控件。它广泛应用于表单、搜索框、评论区等需要用户输入文字的场景

TextField是用于在用户界面中输入文本的控件。它广泛应用于表单、搜索框、评论区等需要用户输入文字的场景。以下是对TextField的详细解释&#xff0c;涵盖其各个方面的功能和属性。 基本属性 text 描述&#xff1a;TextField中当前显示的文本。用法&#xff1a;text: "示…

Py之dashscope:dashscope的简介、安装和使用方法、案例应用之详细攻略

Py之dashscope&#xff1a;dashscope的简介、安装和使用方法、案例应用之详细攻略 目录 dashscope的简介 1、产品的主要特点和优势包括&#xff1a; dashscope的安装和使用方法 1、安装 2、使用方法 dashscope的案例应用 1、通义千问-Max&#xff1a;通义千问2.5系列 2…

【专业性强】地球科学SCI期刊,中科院2区,学术影响力大

一、期刊名称 GIScience & Remote Sensing 二、期刊简介概况 期刊类型&#xff1a;SCI 学科领域&#xff1a;地球科学 影响因子&#xff1a;6.7 中科院分区&#xff1a;2区 三、期刊征稿范围 GIScience & Remote Sensing是一本完全开放获取的期刊&#xff0c;发表…

python实现无监督聚类后的匈牙利匹配

描述 之前文章介绍过DBSCAN&#xff0c;使用C实现过该算法。现在针对某个项目&#xff0c;利用python实现DBSCAN和Kmeans算法。 项目简介&#xff1a;利用某传感器可以采集场景中的点云&#xff0c;每一帧都可以采集数量不等的点(x,y,z)。想要利用DBSCAN和Kmeans对点云进行无监…

Postman接口测试工具的原理及应用详解(四)

本系列文章简介&#xff1a; 在当今软件开发的世界中&#xff0c;接口测试作为保证软件质量的重要一环&#xff0c;其重要性不言而喻。随着前后端分离开发模式的普及&#xff0c;接口测试已成为连接前后端开发的桥梁&#xff0c;确保前后端之间的数据交互准确无误。在这样的背景…

live555的核心数据结构值之闭环双向链表

live555是采用单进程,单线程的服务器,能够同时支持多个客户端连接,并且有条不紊的进行媒体流的调度,很大一部分原因在于对数据结构的巧妙应用。 下面介绍live555核心的数据结构:闭环双向链表 什么是闭环双向链表? 描述: 一个节点保存有前一个节点的地址和后一个节点的…

【云计算】阿里云、腾讯云、华为云RocketMQ、Kafka、RabbitMq消息队列对比

目录 一、云平台中间件关键信息对比 1、RocketMQ 2、Kafka 3、RabbitMQ 二、中间件详细信息 1、阿里云MQ (一)消息队列RocketMQ (二)消息队列Kafka (三)消息队列RabbitMQ 2、腾讯云MQ (一)消息队列RocketMQ (二)消息队列CKafka (三)消息队列RabbitMQ 3、华为云MQ…

【面试系列】TypeScript高频面试题及详细解答

欢迎来到我的博客&#xff0c;很高兴能够在这里和您见面&#xff01;欢迎订阅相关专栏&#xff1a; ⭐️ 全网最全IT互联网公司面试宝典&#xff1a;收集整理全网各大IT互联网公司技术、项目、HR面试真题. ⭐️ AIGC时代的创新与未来&#xff1a;详细讲解AIGC的概念、核心技术、…

求职刷题力扣DAY33--贪心算法part04

DAY 33 贪心算法part04 1. 452. 用最少数量的箭引爆气球 有一些球形气球贴在一堵用 XY 平面表示的墙面上。墙面上的气球记录在整数数组 points &#xff0c;其中points[i] [xstart, xend] 表示水平直径在 xstart 和 xend之间的气球。你不知道气球的确切 y 坐标。 一支弓箭可…

C语言 | Leetcode C语言题解之第202题快乐数

题目&#xff1a; 题解&#xff1a; //计算的过程函数&#xff0c;我没重点讲&#xff0c;很简单看一下代码就好了 int getSum(int n) {int sum 0;while (n) {sum (n % 10) * (n % 10);n / 10;}return sum; }bool isHappy(int n){int sum getSum(n);int hash[820] {0};whi…

QT拖放事件之六:自定义MIME类型的存储及读取demo

1、MIME类型描述 MIME (Multipurpose Internet Mail Extensions) 是描述消息内容类型的标准,用来表示文档、文件或字节流的性质和格式。 MIME 消息能包含文本、图像、音频、视频以及其他应用程序专用的数据。 浏览器通常使用 MIME 类型(而不是文件扩展名)来确定如何处理URL…

SpringBoot脚手架MySpringBootAPI(PgSQL+Druid+MyBatisPlus+Lombok)

MySpringBootAPI SpringBoot脚手架&#xff0c;基于SpringBootDruidPgSQLMyBatisPlusFastJSONLombok&#xff0c;其他的请自行添加和配置。 Author powered by Moshow郑锴(大狼狗) , https://zhengkai.blog.csdn.net 如何运行 1.首先确保你是JDK17&#xff0c;推荐微软的MSJDK…

ueditor解决无法抓取远程背景图片问题的方法(php)

背景 laravel后台经常有用到编辑器的地方&#xff0c;Dcat使用的一般都是UEditor编辑器。最近项目经理在秀米排版以后&#xff0c;将内容复制到UEditor编辑器保存后发现&#xff0c; 在网站页面中发现图片竟然展示失败。经过浏览器控制台发现&#xff0c;图片的域名还是秀米的…

开源AI工具目录:Tap4 AI Tools Directory体验与介绍

在人工智能迅速发展的今天,AI工具正变得越来越多样化,它们在各个领域展现出巨大的潜力和实用性。为了更好地发现和管理这些工具,Tap4 AI Tools Directory提供了一个集中的平台,让AI爱好者和专业人士能够轻松找到所需的工具。 项目概览 项目来源 Tap4 AI工具目录是一个开…

Reqable实战系列:Flutter移动应用抓包调试教程

Flutter应用网络请求调试一直是业内难题&#xff0c;原因在于Dart语言标准库的网络请求不会走Wi-Fi代理&#xff0c;常规通过配置Wi-Fi代理来抓包的方式行不通。这给我们日常开发测试造成了很大的阻碍&#xff0c;严重降低工作效率。因此写一篇教程&#xff0c;讲解如何使用Req…

相机系列——从相机畸变到托勒密地图

by 木一 标签&#xff1a;#相机畸变 #畸变纠正 #鱼眼相机 #折射定律 #托勒密地图 引言 前文[1][2]我们介绍了针孔相机模型&#xff0c;以及针孔相机模型的相机标定过程&#xff0c;但针孔相机模型是对相机成像最简单的描述&#xff0c;实际的相机成像过程要远复杂很多。 首先…

Python | Leetcode Python题解之第202题快乐数

题目&#xff1a; 题解&#xff1a; def isHappy(self, n: int) -> bool:cycle_members {4, 16, 37, 58, 89, 145, 42, 20}def get_next(number):total_sum 0while number > 0:number, digit divmod(number, 10)total_sum digit ** 2return total_sumwhile n ! 1 an…

CSS|05 继承性与优先级

继承性 一、继承性的特点&#xff1a; 1.外层元素身上的样式会被内层元素所继承 2.如果内层元素与外层元素身上的演示相同时&#xff0c;外层元素的样式会被内层元素所覆盖 二、关于继承性的问题 是不是所有样式都能被继承&#xff1f; 答&#xff1a;并不是所有样式能被继承…

Mybatis面试学习

1.介绍一下mybatis mybatis是一个半自动的ORM的框架&#xff0c;ORM就是对象关系映射。&#xff08;对象指的是Java对象&#xff0c;关系指的是数据库中的关系模型&#xff0c;对象关系映射&#xff0c;指的就是在Java对象和数据库的关系模型之间建立一种对应关系&#xff09;…

Linux 搭建 kafka 流程

优质博文&#xff1a;IT-BLOG-CN 一、安装环境 【1】CenOS7虚拟机三台 【2】已经搭建好的zookeeper集群。 【3】软件版本&#xff1a;kafka_2.11-1.0.0 二、创建目录并下载安装软件 【1】创建目录 cd /opt mkdir kafka #创建项目目录 cd kafka mkdir kafkalogs #创建kafk…