前言：始終要相信你能想到的解決方案，基本上都是可以用技術實現的...

解決方法就是在mounted中在this.$nextTick()去獲取，如果沒有獲取到，不是寫法錯就是，元素沒有繫結對地方，注意檢查自己的邏輯，自己在寫什麼思路一定要清晰。

有這樣一個需求：

實現一個表格，每一行代表課程的一期，每一期的天數不固定，每一期有安排老師的要顯示老師的資料，也就是要顯示一個白條來展示資料，白條的寬度可以根據後端給的開始時間和結束時間來計算間隔數從而算出寬度，而白條高度需要根據內容來自適應，左側的期數欄的高度也要對應的顯示相同的高度。白條中的內容顯示體驗要好。

思路：

1、根據每期的開始時間定位白條的起始位置，即當前行的哪一個表格

2、白條設定絕對定位，相對對應的表格定位

3、根據開始時間和結束時間，算出白條應設的寬度值（拿到資料就可以算出來，表格的寬度固定的）

4、白條的高度要注意是在白條裡面的資料顯示渲染完之後再去獲取元素的高度值，在table層（一般會是一個元件）的mouned中通過在this.$nextTick()獲取資料渲染完成之後的元素

5、獲取每一行白條的高度，然後存到陣列中

6、當前白條的父元素tr元素和左側的顯示期數的元素設定和填充了資料的白條的高度，一樣的高度

白條的佈局：

白條用flex佈局，並允許換行，flex-wrap： wrap，裡面的內容分兩列顯示，左側固定一定百分比的寬度（所以內容長度一定要有最大長度不能太長，必須約定），右側不設定寬度，如果內容太長就會換行顯示，體驗會比較好。

低效解決方案：

通過元素個數來算高度，這樣必須保證白條裡面的內容，在超出最小單元格高度時，元素必須每行顯示2個，並且左右兩列必須都設定一定比例的寬度，這樣才能根據內容的個數準確算出白條的總高度。

這個方案解決了高度隨著內容變化而變化的問題，但是沒有解決白條裡面的內容長度很長時的顯示問題，因為白條中左右列寬度是一定的，又是flex佈局，內容太長裡面的內容就會自動換行，視覺效果很不好。

考慮到顯示問題，最終解決方案就應該採用第一種，右側元素寬度不固定，內容太長自動換行顯示，白條高度在資料渲染完畢去讀取的方式最合適。