zoukankan      html  css  js  c++  java
  • React module methods with passing props to child or invoking callback to parent.

    Some code samples for this pupose:

    import React from "react";
    import MyDemo from "./mydemo.jsx";
    
    export default class Square extends React.Component {
      constructor(props) {
        super(props);
        this.state = {
          count: 0
        };
        this.handleChange = this.handleChange.bind(this);
        this.changeMyStateFromChild = this.changeMyStateFromChild.bind(this);
      }
      componentDidMount() {
        let me = this;
        me.setState({
          count: me.state.count + 1
        });
        console.log(me.state.count); // 打印出0
        me.setState({
          count: me.state.count + 1
        });
        console.log(me.state.count); // 打印出0
        setTimeout(function() {
          me.setState({
            count: me.state.count + 1
          });
          console.log(me.state.count); // 打印出2
        }, 0);
        setTimeout(function() {
          me.setState({
            count: me.state.count + 1
          });
          console.log(me.state.count); // 打印出3
        }, 0);
      }
      handleChange(e) {
        let me = this;
        const target = e.target;
        console.log(me);
        alert(me.state.count);
        this.setState({
          [target.name]: target.value
        });
        console.log(MyDemo);
      }
      changeMyStateFromChild(state) {
        // this.setState(state);
        debugger;
        alert(state);
      }
      render() {
        return (
          <div onChange={e => this.handleChange(e)}>
            <MyDemo
              title={this.state.count}
              changeParent={this.changeMyStateFromChild}
            />
            <input type="text" name="username" />
            <input type="text" name="password" />
            <button onClick={() => alert(MyDemo.title)}>click </button>
            <h1>{this.state.count}</h1>
          </div>
        );
      }
    }
    View Code
  • 相关阅读:
    建模算法(九)——拟合 (转)
    Swift初探一
    D3DXMatrixMultiply 函数
    魔术师发牌和拉丁方阵
    strip 命令的使用方法
    GDI编程小结
    Android多媒体-MediaRecorder 录制音视频
    Android 使用Gson解析json案例具体解释
    有依赖的背包问题(背包九讲)
    c++ 正則表達式
  • 原文地址:https://www.cnblogs.com/hualiu0/p/9027022.html
Copyright © 2011-2022 走看看