vue封裝echarts組件 在vue中添加Echarts圖表的基本使用教程?
在vue中添加Echarts圖表的基本使用教程?模塊化單文件引入(推薦)1新建一個echarts.html文件,為ECharts準備一個具備大小(寬高)的Dom,如下圖所示:2新建<script&
在vue中添加Echarts圖表的基本使用教程?
模塊化單文件引入(推薦)
1
新建一個echarts.html文件,為ECharts準備一個具備大小(寬高)的Dom,如下圖所示:
2
新建<script>標簽引入模塊化單文件echarts.js,如下圖所示:
3
新建<script>標簽中為模塊加載器配置echarts和所需圖表的路徑(相對路徑為從當前頁面鏈接到echarts.js),如下圖所示:
4
<script>標簽內(nèi)動態(tài)加載echarts和所需圖表,回調(diào)函數(shù)中可以初始化圖表并驅(qū)動圖表的生成,如下圖所示:
5
瀏覽器中打開ecarts.html,就可以看到以下效果,如下圖所示:
END
標簽式單文件引入
新建一個echarts.html文件,為ECharts準備一個具備大小(寬高)的Dom,如下圖所示:
新建<script>標簽引入echart-all.js,如下圖所示:
新建<script>,使用全局變量echarts初始化圖表并驅(qū)動圖表的生成,如下圖所示:
4
瀏覽器中打開echarts.html,可以看到如下效果,如下圖所示:
Vue被淘汰了嗎?
我今天才開始去了解Vue-cli 3.0,著手寫了一個demo下來發(fā)現(xiàn),簡直驚為天人,拋棄了2.x版本繁瑣的webpack配置,現(xiàn)在的可以說簡潔明了,你甚至不用寫vue.config.js也行,空著唄,反正無傷大雅,但如果你配置一下你會發(fā)現(xiàn)也并不麻煩。
在我知道的知識范圍內(nèi),應該是沒有比這個腳手架更能快速直接地反應出數(shù)組或?qū)ο笞兓牧恕?/p>
此外,語法糖基本沒有很大變化,以前該怎么用現(xiàn)在還怎么用,只是性能優(yōu)化和語法糖很多了。講真,我完全找不到vue-cli3.0致命的坑。
然后,我還看到有人為jq打抱不平,我在一年半以前基本都是用jq寫的,那時候覺得jq是js最好的框架,實在太方便了,操作dom也實在太爽了,直到我某次寫一個排課項目卡了殼。。。
隨后我就轉(zhuǎn)小程序了,發(fā)現(xiàn)小程序的寫法不就是vue么。。。尤其是組件的寫法。。。
講到底,vue被淘汰有點難,畢竟這個時代是操作數(shù)據(jù)的時代,已經(jīng)不是dom操作的天下了。
最后,我覺得你不應該拘泥于前端框架,就算以后會出現(xiàn)更先進的框架,充其量也還是js,我實在想不出在框架這方面還能玩出什么花了。大概es會慢慢參考這些框架,然后自己變成如此也說不定。就比如當年你能想到js里面還能寫class來繼承?我第一次看到還以為是java。。。但現(xiàn)在不也就支持了么。。。
所以為什么不把目光放向后端?node都熟練了嗎?deno了解過嗎?php入門了嗎?python好歹掌握一下吧?這些語言我相信以后會慢慢出現(xiàn)在前端必會知識點里面(雖然php已經(jīng)是了,但感覺過氣了啊,說好的php是世界上最好的語言呢。。。)