近日,E charts上的功能 需要根据返回的数据去动态展示
设置鼠标悬停的效果 显示表格或者其他形式 在拼接输入的时候卡住了
首先是E charts的formatter函数 写在这里面
其次 是 es6这个模板字符串 后台返回的数据 去进行循环遍历的时候 怎么设计这个拼接
比如 在for循环里面 先声明个空数组 一定要是数组拼接一下li 再在外面 拼接这个变量数组
formatter: function (params, ticket) {
if (params.data.fdata !== '') {
let newArrdata = params.data.fdata
let fornowdata = []
let ciname = params.name
for (let i = 0; i < newArrdata.length; i++) {
fornowdata += `
<ul style="display: flex;border: 1px solid rgba(128,111,111,0.35)"> <li style="list-style: none;text-align: center">
<span class="spantit" style="font-size:12px;color: aquamarine ">${newArrdata[i].name}</span><br/>
<span style="font-size: 8px">${newArrdata[i].q}</span><br/>
<span style="font-size: 8px">${newArrdata[i].p}</span><br/>
<span style="font-size: 8px">${newArrdata[i].c}</span><br/>
<span style="font-size: 8px">${newArrdata[i].y}</span><br/>
<span style="font-size: 8px">${newArrdata[i].w}</span> </li> </ul> `
}
return `
<div style="font-size: 14px;font-weight: bold">${cname}</div> <div style="display: flex;flex-wrap: wrap;justify-content: space-between;">${fornowdata}</div> `
} else { // 为了防止没有定义
}
}
刚开始的时候 我没有这个+=,只有=;恍然大悟,单个的=肯定只有一个;
卡了一会,自己找到问题并且解决的感觉是真的好。
虽然但是 这是对我来说 遇见的问题。遇见了就处理 下次就熟悉了。