使用setState修改state的值

最新推荐文章于 2024-03-13 16:23:37 发布

dong.wang

最新推荐文章于 2024-03-13 16:23:37 发布

阅读量908

点赞数

分类专栏： react

本文链接：https://blog.youkuaiyun.com/wangdong9395/article/details/109054211

版权

react 专栏收录该内容

33 篇文章

订阅专栏

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script src="https://cdn.staticfile.org/react/16.4.0/umd/react.development.js"></script>
    <script src="https://cdn.staticfile.org/react-dom/16.4.0/umd/react-dom.development.js"></script>
    <script src="https://cdn.staticfile.org/babel-standalone/6.26.0/babel.min.js"></script>
</head>

<body>
    <div id="root"></div>
    <script type="text/babel">
    // 有状态组件中state的基本使用
    class Hello extends React.Component {
        state = {
          count: 1
        }
        render() {
            return (
                <button onClick = {() => {this.setState({
                    count: this.state.count + 2
                })}}>计数器--------------{this.state.count}</button>
            )
        }
    }

    ReactDOM.render(<Hello />, document.getElementById('root'))
        
    </script>
</body>

</html>