react 组件监听浏览器窗口变化

react 组件监听浏览器窗口变化

react 组件实现监听浏览器窗口变化,需要在window对象中添加监听事件,事件中参数1是监听的事件,参数2为事件调用的方法。

// 监听浏览器窗口变化
componentDidMount() {
   // 在window对象中添加监听事件
   window.addEventListener('resize', this.resizeWindow)
}

// 移除监听窗口变化的事件
componentWillUnmount() {
   window.removeEventListener('resize', this.resizeWindow)
}

// 窗口变化执行的方法
resizeWindow = ()=>{
   let screenWidth = document.body.offsetWidth
   console.log(screenWidth)
   if(screenWidth < 1200){
       
   }else{
       
   }
}

你可能感兴趣的:(react,前端,react,组件,监听浏览器窗口变化,resize)