zoukankan      html  css  js  c++  java
  • react知识补漏

    默认属性值props

    function Person(props){
        return 
    }
    
    Person.defaultProps = {
        name:'jim'
    }
    

    refs

    <input ref="content">
    
    this.refs.content
    
    <input type="text" ref={input=>this.input=input} /> 可以这样设置获取得到input元素
    使用的时候使用  alert("input-value"+this.input.value);
    

    在严格模式下直接使用ref会报错

    还有注意ref需要升级版本,不要提示会报错,但是能运行
    https://stackoverflow.com/questions/53460689/react-ref-current-is-null

    组件通信

    父-》子 
    props <child name={hahha} />
    
    this.props.name
    
    子-》父
    1.在父组件定义修改方法
    parent.js
      childChangeW(){
      	this.setState({
      		w:'childrenchange'+Math.random()
      	});
      }
    2.当做props传递事件
    <Statedchild name="hahhah" childChangeW ={this.childChangeW}/>
    
    3.子组件用事件接收处理,不能直接触发的
    <button onClick={this.changeFun}>改变父组件W</button>
    
    	changeFun(){
    		this.props.childChangeW();
    	}
    
    不能下面这样
    X <button onClick={this.props.childChangeW}>改变父组件W</button>
    
    
    
    

    样式

    this.state = {bgc:'#53ff53}
    	<p style={{background:this.state.bgc}}>{this.state.w}</p>
    className={this.state.flag?'active':'haha'}
    注意是两次括号的
    


    生命周期



  • 相关阅读:
    【leetcode】第一个只出现一次的字符
    【leetcode】0~n1中缺失的数字
    054696
    053695
    053694
    053693
    053692
    053691
    053690
    053689
  • 原文地址:https://www.cnblogs.com/cyany/p/12757957.html
Copyright © 2011-2022 走看看