vue 将有html标签的字符串转换为HTML标签

原创已于 2025-03-25 11:29:20 修改 · 3.8k 阅读

3 ·

CC 4.0 BY-SA版权

柳晓黑胡椒

文章标签：

#vue.js

于 2023-02-27 16:28:03 首次发布

vue实践专栏收录该内容

24 篇文章

订阅专栏

文章描述了一个前端开发场景，其中后端传递给前端一个带有标签的字符串，前端通过Vue.js的v-html指令将其转换为HTML格式进行显示。在循环遍历businessTypeArry数组时，每个item的businessName被插入到HTML结构中，同时显示了item的创建时间（经过截取处理）。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

🚀 个人简介：某大型测绘遥感企业资深Webgis开发工程师，软件设计师(中级)、优快云优质创作者
💟 作者：柳晓黑胡椒❣️
📝 专栏：vue实践
🌈 若有帮助，还请关注 ➕ 点赞➕收藏，不行的话我再努努力💪💪💪

后台传过来一个带标签的字符串, 前端可以直接转换成html格式的
在这里插入图片描述
注意：使用了v-html的标签中的内容将 item.businessName 添加进去

<div class="businessTable_th" v-for="(item, index) in businessTypeArry" :key="item.id" >
   <div class="span_id">{{ index+1 }}</div>
   <div v-html="item.businessName"></div>
   <div>{{ item.createtime?.slice(0, 7) }}</div>
</div>