? 這幾天在寫數(shù)據(jù)統(tǒng)計(jì)圖，折線圖等等，使用的是echarts, 因?yàn)槲疫@個(gè)統(tǒng)計(jì)數(shù)據(jù)界面是封裝在一個(gè)組件里面的，然后在選項(xiàng)卡<el-tab-pane> 中調(diào)用

因?yàn)樾枨笫且y(tǒng)計(jì)圖跟著屏幕大小自適應(yīng)，不能寫死，所以我寬度給了 100% 根據(jù)父視圖的大小來(lái)。

如下：

給div 定義寬度為100%之后 然后在?mounted() 方法去聲明一個(gè)頁(yè)面監(jiān)聽方法 這樣頁(yè)面改變了 就會(huì)觸發(fā)事件

這樣設(shè)置之后 圖表的大小確實(shí)會(huì)根據(jù)頁(yè)面的大小進(jìn)行自適應(yīng)，但這個(gè)時(shí)候存在一個(gè)問(wèn)題，就是頁(yè)面剛初始化的時(shí)候，圖表剛開始默認(rèn)大小是100px 特別的小，然后再去拉動(dòng)頁(yè)面的大小后 立馬又正常了。

如下：

因?yàn)轫?yè)面剛初始化的時(shí)候，圖表的頁(yè)面是放在選項(xiàng)卡<tabs>里面的 在選項(xiàng)卡切換的時(shí)候，頁(yè)面在渲染，圖表頁(yè)面拿不到父視圖的大小所以給默認(rèn)了一個(gè)100px的寬高。

解決這個(gè)問(wèn)題的方案就是 延遲選項(xiàng)卡切換時(shí)的頁(yè)面渲染

在選項(xiàng)卡上添加 layz

如下：

這樣就解決了 頁(yè)面初始化 圖表很小的問(wèn)題

還有一種方法就是?可以借用v-if在切換的時(shí)候使echart圖重新渲染