国产探花免费观看_亚洲丰满少妇自慰呻吟_97日韩有码在线_资源在线日韩欧美_一区二区精品毛片,辰东完美世界有声小说,欢乐颂第一季,yy玄幻小说排行榜完本

首頁 > 編程 > JavaScript > 正文

iview table高度動態設置方法

2019-11-19 14:10:16
字體:
來源:轉載
供稿:網友

在使用iview table表格組件的時候,由于我的屏幕分辨率比較大,在自己pc機上設置的固定高度很適合,在測試(test)時候發現在別的終端如1368*768的機器上都顯示不全,下面就把我的和其他機器上效果圖做個對比,如圖所示:

一、我的機器

二、別人的機器

三、解決辦法

原因就是因為表格高度是固定的,在大分辨率下的屏幕可以顯示,小分辨率的屏幕就顯示不完全,所以我們需要動態的去設置表格的高度,設置方法如下:

1、iview table的寫法:

<Table highlight-row border :columns="columns7" :data="data6" ref="table" :height="tableHeight"></Table> 

2、高度設置,初始化的時候就設置

(1)首先在data里面初始化

tableHeight: 450, 

(2)初始化

mounted() {  // 設置表格高度  this.tableHeight = window.innerHeight - this.$refs.table.$el.offsetTop - 160  }, 

window.innerHeight是瀏覽器的可用高度,this.$refs.table.$el.offsetTop是表格距離瀏覽器可用高度頂部的距離,這樣就可以完成動態設置了,這樣的話就可以適應任何pc端屏幕了

以上這篇iview table高度動態設置方法就是小編分享給大家的全部內容了,希望能給大家一個參考,也希望大家多多支持武林網。

發表評論 共有條評論
用戶名: 密碼:
驗證碼: 匿名發表
主站蜘蛛池模板: 玉林市| 集贤县| 准格尔旗| 榆林市| 五华县| 克什克腾旗| 崇文区| 武安市| 大庆市| 靖江市| 广元市| 灌阳县| 高平市| 波密县| 云龙县| 义马市| 丹江口市| 德兴市| 平度市| 和硕县| 高唐县| 疏勒县| 侯马市| 泗水县| 岗巴县| 宽甸| 奉化市| 老河口市| 班玛县| 福海县| 赤水市| 札达县| 郧西县| 金门县| 岳阳县| 墨江| 永靖县| 肇源县| 乌拉特前旗| 博爱县| 佛冈县|