如何更新ApexCharts系列中的数据 我使用ApexCharts创建了以下Vue 组件。该组件从一堆这些组件所在的父级获取更新。更新后的值是通过 props 传入的。
<template>
<div>
<apexchart type="line" width="1000px" :options="options" :series="series"></apexchart>
</div>
</template>
<script>
import Vue from 'vue';
import VueApexCharts from 'vue-apexcharts';
Vue.use(VueApexCharts);
Vue.component('apexchart', VueApexCharts);
export default {
name: 'EnergyConsumption',
props: {
channel1: Number,
channel2: Number,
},
data() {
return {
options: {
chart: {
id: 'vuechart-example',
},
xaxis: {
categories: ['Channel 1', 'Channel 2'],
},
},
series: [
{
name: 'series-1',
data: [this.channel1, this.channel2],
},
],
};
},
methods: {
updateSeries() …
Run Code Online (Sandbox Code Playgroud)