• ReactNative--state


    事件处理

    React中的事件名称,组件中包含一个button,给button绑定onClick事件

    定义一个组件:button 给button绑定onClick事件

        var MyButton = React.createClass({
          handleClick:function () {
            alert("点击按钮触发的效果");
          },
          render:function () {
            return(
              <button onClick={this.handleClick}>{this.props.buttonTitle}</button>
            );
          }
        });
    
        ReactDOM.render(
          <MyButton buttonTitle="button"/>,
          document.getElementById("container")
        );

    state 状态

    props 组件自身的属性

        var CheckButton = React.createClass({
          getInitialState:function () {
            return{
              isCheck:false
            }
          },
          handleChange:function () {
            this.setState({
              isCheck:!this.state.isCheck
            });
          },
          render:function () {
            //在jsx语法中,不能直接使用if,使用三目运算符
            var text = this.state.isCheck ? "yes" : "no";
            return(
              <div>
                <input type="checkbox" onChange={this.handleChange} />
                {text}
              </div>
            );
          }
        });
    
        ReactDOM.render(
          <CheckButton />,
          document.getElementById("container")
        );
    
    //当state发生变化时,会调用组件内部的render方法
  • 相关阅读:
    加法图灵机
    Experiment 1
    进制转换
    快速排序
    辗转相除、线段交点、多角形面积公式
    JS如何优雅监听容器高度变化
    解决react和其他框架之间的交互问题
    MacBook Pro触控板手势
    代理 请求登录失效(显示未登录)问题
    Web端 长按事件
  • 原文地址:https://www.cnblogs.com/chebaodaren/p/6430463.html
Copyright © 2020-2023  润新知