vue真的坑太多！雖然入門簡單易上手，但是，大專案真的不建議使用此框架，分分鐘重新整理世界觀，很多生命週期問題、載入問題、傳值問題、監聽問題……
能填一個是一個，能救一人是一人，特意寫篇標題明顯的，希望能一下就被檢索到。

表格存在且有內容，行數可被打印出來，但是獲取到的行數和高度卻為0。
程式碼：

methods: {
   aaa () {
        console.log('——————————————————測試——————————————————');
        console.log('表格html：', this.$refs.abc);
        console.
 
log('表格.rows：', this.$refs.abc.rows);
        console.log('表格.rows.length：', this.$refs.abc.rows.length);
        console.log('表格.offsetHeight：', this.$refs.abc.offsetHeight);
        console.log('——————————————————測試——————————————————');
   }
}

執行結果：

為何如此？

因為是渲染之前列印的這個陣列，看到的卻是渲染後的資料，通俗的講，就是這個dom結構還沒載入完，js就執行了。

如何解決？

等dom結構載入完成後再去獲取這個陣列。
vue等待渲染完執行的函式： vm.$nextTick(function({console.log(…)}))

修改後程式碼：

methods: {
   aaa () {
        this.$nextTick(() => {
             console.log('——————————————————測試——————————————————');
             console.log('表格html：', this.$refs.abc);
             console.log
 
('表格.rows：', this.$refs.abc.rows);
             console.log('表格.rows.length：', this.$refs.abc.rows.length);
             console.log('表格.offsetHeight：', this.$refs.abc.offsetHeight);
             console.log('——————————————————測試——————————————————');
        })
   }
}

修改後執行結果：