State用法

空中海

于 2022-10-24 22:54:08 发布

阅读量571

点赞数 1

文章标签： 1024程序员节

本文链接：https://blog.youkuaiyun.com/liuyinghui523/article/details/127504144

版权

import React, { Component } from 'react' 

import ReactDOM from 'react-dom' 

class App extends Component { 

constructor() { 

super() 

this.state = { 

name: 'React', 

isLiked: false 

} 

}

handleBtnClick = () => { 

this.setState({ 

isLiked: !this.state.isLiked 

}) 

}

render () { 

return ( 

<div> 

<h1>欢迎来到{this.state.name}的世界</h1> 

<button onClick={this.handleBtnClick}> 

{ 

this.state.isLiked ? '❤取消' : '🖤收藏' 

} 

</button> 

</div> 

) 

} 

}

ReactDOM.render( 

<App/>, 

document.getElementById('root') 

)