react实现计数器

最新推荐文章于 2025-05-13 06:48:14 发布

多看点书

最新推荐文章于 2025-05-13 06:48:14 发布

阅读量1.9k

点赞数

CC 4.0 BY-SA版权

本文链接：https://blog.youkuaiyun.com/weixin_43789858/article/details/90213721

本文介绍了一个使用React构建的简单计数器应用，通过按钮点击减少计数器数值，展示了React组件状态管理和事件处理的基本用法。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

在这里插入图片描述

     var In=({display})=><div>{display}</div>;
     var Btn=({click})=><button onClick={click}>-</button>
     class Davinci extends React.Component
      {
          constructor(props) {
            super(props)
          
            this.state = {
               count:100
            };
            this.clickfunc=this.clickfunc.bind(this);

          };
        clickfunc=function(){
            this.setState({
                count:this.state.count-1,
            })
        } 
       render() {
         return (
           <div>
             <In display={this.state.count}/>
             <Btn click={this.clickfunc}/>
           </div>
         )
       }
     }
     ReactDOM.render(
            <div>
                <Davinci/>
            </div>
            , document.querySelector('#container')
        )