echart インスタンスのクリアと破棄 -clear/dispose

Clear と destroy は、メモリ オーバーフローを解決するために echarts によって提供されるメソッドです。 

    import * as echarts from "echarts";    
    // 销毁实例
    desHander(){
        let myChart = echarts.init(this.$refs["chartDom"]);
        // 销毁实例,销毁后实例无法再被使用。
        // 在什么情况下需要调用该函数进行销毁当前的实例呢?
        // 官方给的说明:在图表容器被销毁之后,调用 echartsInstance.dispose 销毁实例,
        myChart.dispose();
    },

    // 清空当前实例
    clearHander(){
        // 清空当前实例,会移除实例中所有的组件和图表。
        let myChart = echarts.init(this.$refs["chartDom"]);
        myChart.clear() 
    },
    init(){
        this.clearHander()
          //或者
        this.desHander()
        let myChart = echarts.init(this.$refs["chartDom"]);
    }

メモリ オーバーフロー: プログラムの実行時に必要なメモリが現在のアプリケーション システムの残りのメモリを超えると、メモリ オーバーフローの状況が発生します。

したがって、echart を使用するときは必ず、それを消去または破棄することをお勧めします。

echarts.clear() は現在のインスタンスをクリアし、インスタンス内のすべてのコンポーネントとチャートを削除します。

echarts.dispose() はインスタンスを破棄します。破棄後、インスタンスは使用できなくなります。

ClearとDisposeはv-showとv-ifに似ていると思います

Clear は v-show に似ていますが、チャートを再描画するだけです

destroy は v-if に似ており、echarts オブジェクトをクリーンアップしてから echarts オブジェクトを再構築します。

チャート コンテナさえも破棄された場合は、 echarts.dispose() を呼び出してインスタンスを破棄します。

使用シナリオ: echarts チャートのデータが動的に更新されてからチャートがレンダリングされる場合、watch を使用してデータの変更を監視し、更新されたデータを取得したとしても、チャートはそれに応じてレンダリングされず、クリアまたは破棄されません。

おすすめ

転載: blog.csdn.net/ANNENBERG/article/details/128656058