工作随笔，问题记录以及解决办法（vue自适应浏览器）

1.vue中使内容自适应浏览器的大小

Q1.内容自适应浏览器大小，如：让一个div的宽高随着浏览器的窗口而变化

首先给这个div一个动态的样式，用动态style，：style="{width:width+'px'}"用这个变量去设置它，如在data（）里声明

width：0，然后给这个width赋值，用window.innerHtmlWidth来获取浏览器的宽度，然后赋值给这个变量，这样div的宽度自适应浏览器，但是当用户缩放浏览器窗口时，div的宽度是不会变化的，这就第二个问题使div随着浏览器的变化而自适应

Q2.内容随着浏览器的变化而变化

在vue中我们用我window.onresize来监听浏览器的窗口变化，然后用mounted来监听这个函数，如：

mounted(){
  let _this = this;
  // 注：window.onresize只能在项目内触发1次，是监听当前浏览器窗口的
  window.onresize = function () {
    这里监听当前窗口的大小，然后赋值给width，特别注意的是不能用this直接点width，因为
    在window对象内，this指的是当前窗口window，所有不能用this.width，因为窗口对象找不到width，
    所以要在window的外面声明一个变量来接收vue实例，如上_this的做法
  }
},

至此问题解决！！！！