python窗口大小动态变化_当视窗size改变的时候，在react里要怎么监听视窗大小的变化呢？...

这个在窗口大小不变的时候是ok的，但如果你改变了窗口的大小，下面那排点就会出现问题(主要是因为我这排点的数量是动态算出来的，然而因为左边的这个大圆的left的值我是最初设置了一个initial state,是window.innerWidth * 0.32，然后因为改变视窗大小这个行为没有改变这个state，所以我的大圆不动，导致那排点的数量保持不变，这样窗口大小变化的时候就会出现明显bug。。。

(不知道我这么说各位能不能理解，贴一段代码)：

class SlideButton extends React.Component{

constructor(props){

super(props);

this.state = {

left: this.props.left,

isDragging: false, //设置是不是在drag状态下

relativex:null,

};

}

handleMouseDown(e){

this.setState({

isDragging: true,

relativex: e.pageX - this.props.left

});

}

handleMouseMove(e){

if(this.state.isDragging){

const maxX = window.innerWidth *0.57;

let moveX = e.pageX - this.state.relativex;

moveX = Math.min(Math.max(this.props.left, moveX), maxX);

this.setState({left: moveX});

}else{

return false;

}

console.log((window.innerWidth*0.6 - this.state.left) / 30);

}

handleMouseUp(e){

const maxX = window.innerWidth *0.57;

if(this.state.left === maxX){

this.setState({

isDragging: false,

relativex: null,

});

this.props.handleChild();

}else{

this.setState({

isDragging: false,

relativex: null,

left: this.props.left

});

}

}

render(){

const left = this.state.left;

let dotCount = Math.floor((window.innerWidth*0.6 - left) / 12);

return (

{'>'}

{'.'}

);

}

}

const DotLine = ({count}) =>{

const dotline = [];

for(let i =0; i< count-8; i++){

dotline.push(

);

}

return (

{dotline.concat()}

);

}

然后问题来了：在react里要怎么监听视窗大小的变化呢？