一:使用:ref 把列表里面的数据传递进divs中,自定义了一个字段为dataChart用来接收数据
<el-table-column label="价格折扣率" width="220">
<template #header>
<el-space wrap>
<p class="align-bottom pt-3 fs-5">销量趋势</p>
<el-tooltip
class="box-item"
effect="dark"
content="热门商品信息名称"
placement="top-start"
>
<el-icon class="align-middle pb-1" style="font-size: 15px"
><question-filled
/></el-icon>
</el-tooltip>
</el-space>
</template>
<template #default="scope">
<div
:dataChart="scope.row"
:ref="
(el) => {
if (el) divs[scope.$index] = el;
}
"
style="width: 220; height: 200px"
></div>
</template>
二:在setup中
const divs = ref([]);
watchPostEffect(() => {
console.log("测试数据", divs, divs._value);
divs._value.forEach((item, index) => {
console.log("itemmmmmmmmmm", item);
var myChart = echarts.init(item);
var option;
option = {
xAxis: {
type: "category",
data: [ "Fri", "Sat", "Sun"],
},
yAxis: {
type: "value",
},
series: [
{
data: [135, 147, 260],
type: "line",
},
],
};
option && myChart.setOption(option);
});
});
ps:我们传入的数据在item下的v-node中可以找到并使用