解决H5页面转移到app上时的一些问题

最近做了一个项目,是用H5进行开发,然后嵌入到APP中。

但是嵌入后,出现了以下问题:

1.左上角返回按钮history.back()返回上一页失败。

解决方法:改成

import { useRouter } from "vue-router";
const router = useRouter();
const onClickLeft = () => router.back();

即可。

2.页面显示雷达图后,离开页面重新进入不显示雷达图。

解决方法:

定义个myChart变量

let myChart = null;

给myChart赋值图表init方法的结果。

myChart = echarts.init(chartDom, null, setEchartH);

离开页面时销毁图表。

import { onBeforeRouteLeave, onBeforeRouteUpdate } from "vue-router";
onBeforeRouteLeave((to, from, next) => {
  myChart.dispose();
  next();
});

该问题的原因是离开页面canvas没有被销毁导致第二次进页面无法显示。

posted @ 2022-05-18 15:27  罗毅豪  阅读(220)  评论(0编辑  收藏  举报