const obi='1.qqqqqqq 2.wwwwwww 3.eeeeeee 4.rrrrrrrrrrr'
obj.split(' ') //按照空格切割
console.log(obj)// ['1.qqqqqqq','2.wwwwwww','3.eeeeeee','4.rrrrrrrrrrr']
这个时候要放到页面里面去换行,直接for in循环给每个加上你所需求的标签跟
for(var i in obj){
obj[i]='<span>'+obj[i]+'<span/>'
obj=obj.join('<br/>')
这样其实就是切割好了,但是这个状态下是字符串格式,给他在加个toString(),然后直接把他放到页面中显示就好了
obj=obj.join('<br/>').toString()
我应用的场景是element messagebox里面,直接把obj放到content的位置,改个messagebox(alert
、confirm
)的属性 dangerouslyUseHTMLString: true,//为true时,自动把content转换成html
所以我这里没有加span没有for in那一步,但是如果你们有需要的话可以再那边加上所需求的就是可以了
const obi='1.qqqqqqq 2.wwwwwww 3.eeeeeee 4.rrrrrrrrrrr'obj.split(' ') //按照空格切割console.log(obj)// ['1.qqqqqqq','2.wwwwwww','3.eeeeeee','4.rrrrrrrrrrr']这个时候要放到页面里面去换行,直接for in循环给每个加上你所需求的标签跟for(var i in obj){ obj[i]='<span>'+obj[i]+'<span
非字符串模板:在单文件里用 指定的模板,换句话说,写在 html 中的就是非字符串模板。
字符串模板:在js字符串中定义的模板。
2、Props属性:HTML 特性是不区分大小写的。所以,当使用的不是字符串模板时,camelCase (驼峰式命名) 的 props属性需要转换为相对应的 kebab-case (短横线分隔式命名):
(1)、HTML模板:
Vue.component('child', {
// 在 JavaScript 中使用 camel
datav模版
内容概要:组件库基于Vue ,主要用于构建大屏(全屏)数据展示页面即数据可视化,具有多种类型组件可供使用,主要包含三个大屏demo案例。
适合人群:具备一定编程基础,组件库的开发和调试都使用Chrome浏览器
能学到什么:
①边框、装饰、图表和其他大屏控件等都是怎么在Vue中体现的;
②基于Vue的dataV 项目demo案例。
阅读建议:此资源提供dataV demo案例,不仅是代码编写实现也更注重内容上的需求分析和方案设计,所以在学习的过程要结合这些内容一起来实践,并调试对应的代码。
list: [
{ name: '迪丽热巴', department: '测试部门', dateTime: '2022-04-19 17:30', remark: '从昆明到大理', typeText: '0' },
{ name: '迪丽热巴', depa
1 <el-table-column label="详细" min-width="200">
2 <template slot-scope="scope">
3 <span v-html="**cutout(scope.row.log\_op\_detail)"**/>(取到字段里对应的内容,调用cutout方法)v-html会将其中html标签解析后输出。