在vue中使用resize事件监听浏览器窗口的变化

问题:在项目中的需求是根据浏览器的视口来判断是否显示下拉框,想法是使用window的resize事件来监听窗口大小的变化,如果窗口高度小于900,则显示下拉框,高于则隐藏下拉框


在vue中使用resize事件监听浏览器窗口的变化_第1张图片
image.png

最初是在script中注册的resize事件,遇到一个问题,窗口发生变化的时候,vue无法监听到窗口的变化,从而无法更新绑定的值。
解决:在mounted钩子中注册resize事件,在使用watch监听数据的变化,重新赋值


在vue中使用resize事件监听浏览器窗口的变化_第2张图片
image.png

你可能感兴趣的:(在vue中使用resize事件监听浏览器窗口的变化)