之前已經(jīng)講過如何利用formatter自定義提示框內(nèi)容，echarts中示例的寫法是如下圖所示的，使用es5寫法可以省略‘：’和function，這也是vue中普通函數(shù)的寫法。

    以上是需要實現(xiàn)的效果，使用tooltip就能實現(xiàn)，問題是7月15號這個標題如何能加入到提示框組件中。其他的大家可以看我的上一篇文章來實現(xiàn)。

    去百度查閱資料，有一種解決辦法是在每個data中的value添加一個新的數(shù)據(jù)。這種方法可行，但如果是幾百個，幾千個數(shù)據(jù)呢，我們不可能加上幾千條數(shù)據(jù)。

    vue中函數(shù)是不推薦使用箭頭函數(shù)的，因為會使this指向變?yōu)閣indow對象，而不是vue實例。由于慣性思維，我在寫echarts的formatter的回調(diào)函數(shù)時，依然使用的是常規(guī)的普通函數(shù)寫法。

    當我們使用普通函數(shù)打印this和params的時候，得到如下圖片的東西，大家看，this是undefined，在嚴格模式下，普通函數(shù)的this就是undefined。這樣在echarts中就拿不到vue中定義的數(shù)據(jù)了。

    但是如果我們使用箭頭函數(shù)，箭頭函數(shù)this指向其所在的上下文，也就是會躍出formatter指向vue實例，這樣我們就能拿到data中定義的數(shù)據(jù)了。

    以下是實現(xiàn)的方法，貼一下代碼。