vue-echarts-v3
vue-echarts-v3 copied to clipboard
Tip for Quasar SSR users
Got it working like this.
quasar.conf.js:
boot: [
'auth',
'i18n',
'axios',
{
server: false,
path: 'echarts'
}
],
boot file:
// https://github.com/xlsdg/vue-echarts-v3
import * as ECharts from 'echarts/lib/echarts'
import Wrapper from 'vue-echarts-v3/src/wrapper.js'
const DIEcharts = Wrapper(ECharts)
DIEcharts.__echarts__ = ECharts
export default ({ Vue }) => {
// register component to use
Vue.component('di-echart', DIEcharts)
}
somponent:
<template>
<q-card class="q-pa-sm" style="background:#eeeeee">
<q-card-section class="q-pa-none q-pt-md">
<q-no-ssr>
<di-echart
v-if="getLineChartOptions"
style="height: 250px;"
:option="getLineChartOptions"
:resizable="true"
></di-echart>
</q-no-ssr>
</q-card-section>
</q-card>
</template>
<script>
import 'echarts/lib/chart/line'
import 'echarts/lib/component/tooltip'
export default {
.......
Please confirm if this is a solid solution?