uniapp app段使用原生echarts

可以使用 uni-app 官方提供的 uni-echarts 插件来在 App 端使用原生 ECharts。uni-echarts 插件封装了 ECharts 的初始化和渲染，同时提供了一些常用的配置项和事件回调函数。使用方法如下：

1. 在 HBuilderX 中安装 uni-echarts 插件。

2. 在需要使用 ECharts 的页面引入 uni-echarts 组件，并在页面的 data 中声明 echartsOption 对象，用于配置图表的参数。

   <template>
     <view class="echarts">
       <uni-echarts :option="echartsOption"></uni-echarts>
     </view>
   </template>
   
   <script>
   import uniEcharts from '@/components/uni-echarts/uni-echarts.vue'
   
   export default {
     components: {
       uniEcharts
     },
     data() {
       return {
         echartsOption: {
           // 配置项
         }
       }
     }
   }
   </script>

3. 在页面的 onReady 生命周期函数中调用 uniEcharts 的 init 方法，传入需要渲染的 canvas 的 id 和 echartsOption 对象，即可渲染 ECharts 图表。

   onReady() {
     this.$nextTick(() => {
       this.$refs.echarts.init('myCanvas', this.echartsOption)
     })
   }

4. 在需要更新图表数据时，直接修改 echartsOption 对象的值，并调用 uniEcharts 的 setOption 方法进行更新。

   this.echartsOption.series[0].data = [1, 2, 3, 4, 5]
   this.$refs.echarts.setOption(this.echartsOption)

注意：在使用 uni-echarts 插件时，需要在 App 端配置好 ECharts 的 CDN 地址，否则会出现无法加载 ECharts 的情况。