当前位置: 首页 > Web前端 > HTML5

反应

时间:2023-04-05 01:26:09 HTML5

letcolorArr=["red","yellow","blue","orange","pink","green","gray"];classHelloWorldextendsReact.Component{constructor(props){super(props);this.state={bgColor:"黄色"};this.toggleColor=this.toggleColor.bind(这个);this.changeColor=this.changeColor.bind(这个);}toggleColor(){if(this.state.bgColor=="yellow"){this.setState({bgColor:"red"});}else{this.setState({bgColor:"yellow"});}}componentDidMount(){让colorPos=0;setInterval(()=>{this.setState({bgColor:colorArr[colorPos]});if(colorArr.length-1>colorPos){颜色位置++;}else{colorPos=0;}},1000)}changeColor(event){this.setState({bgColor:event.target.value})}render(){console.log(this.props.name);//jsxletobjStyle={background:this.state.bgColor,fontSize:26};return(

我叫嘉伟

);}}让app=document.getElementById("app");ReactDOM.render(,app);