Class 与 Style 绑定

需要学习:https://cn.vuejs.org/v2/guide/class-and-style.html

Style的绑定实例,Style绑定时不会覆盖原来style的内容,自动添加进去。

 <div
    :style="{height:this.height}"
    class="auto_height_table"
    style="padding:0px 20px;overflow:auto"
  >
data() {
    return {
      height: 500,
    };
  },
 autoChangeTableHeight() {
      let allHeight = window.innerHeight;
      let dos = document.getElementsByClassName("auto_height_table");
      for (let i = 0; i < dos.length; i++) {
        let d = dos[i];
        let offsetTop = d.offsetTop;
        let gloHeight = 40;
        let h = allHeight - gloHeight - offsetTop;
        this.height = h + "px";
      }
    }
  },
created() {
    this.query();
    this.autoChangeTableHeight();
  },
  mounted() {
    this.$nextTick(_ => {
      this.autoChangeTableHeight();
      window.onresize = _ => {
        this.autoChangeTableHeight();
      };
    });
  },
  destroyed() {
    window.onresize = "";
  }
posted @ 2019-10-08 17:04  背着泰山找黄河  阅读(104)  评论(0编辑  收藏  举报