iview表格高度跟随 F11 全屏变化

最新推荐文章于 2022-09-15 15:35:38 发布

chuiniu2020

最新推荐文章于 2022-09-15 15:35:38 发布

阅读量376

点赞数 1

分类专栏：学习笔记文章标签： vue

本文链接：https://blog.csdn.net/qq_38172366/article/details/106261472

版权

学习笔记专栏收录该内容

3 篇文章 0 订阅

订阅专栏

表格高度跟随 F11 全屏变化

下面是vue+iview的实现代码

<Table :height="table_height"></Table>

<script >
  export default {
    data() {
      table_height: 0
    },
    mounted() {
      // 动态设置背景图的高度为浏览器可视区域高度
      this.table_height = `${document.body.clientHeight - 330}`
      console.log('高度1:', JSON.parse(JSON.stringify(this.table_height)))
      // 然后监听window的resize事件．在浏览器窗口变化时再设置下表格高度．
      const that = this
      window.onresize = function temp() {
        that.table_height = `${document.body.clientHeight - 330}`
        console.log('高度2:', JSON.parse(JSON.stringify(that.table_height)))
      }
    }
  }
}</script>

[经验一:window.onresize写在mounted里面就能实时监听屏幕的变化]
[经验二:高度后面不能加单位:px,否则无法滚动,具体缘由不清楚]
[经验三:window.addEventListener不能实现监听]