基于react组件之间的参数传递(详解)

1、父组件向子组件传递参数

class Child extends Component {
　 componentDidMount(){

　 
let name = this.props.default;


　 console,log(name);

　 }

　 render(){


　 const { default} = this.props;

　 
return (




<Input />



)
   }
}

import React, { Component } from 'react';
import Child from './Child';

class Parent extends Component {
  state = {
    name: 'Bob'
  }
  render() {
    return (
      <div>
        <Child default={this.state.name} />
      </div>
    )
  }
}

2、子组件向父组件传递参数

class Child extends Component {
　 state={



name:'Bob'

　 }

　 componentDidMount(){



this.props.toParent(this.state.name);

  }

　 render(){

　 
return (




<Input />



)
   }
}

import React, { Component } from 'react';
import Child from './Child';

class Parent extends Component {
 state = {


name:''
  }
  getChildInfo = (name)=>{

 
this.setState({name:name});

 }
  render() {
    return (
      <div>
        <Child toParent={this.getChildInfo.bind(this)} />
      </div>
    )
  }
}

以上这篇基于react组件之间的参数传递(详解)就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持三水点靠木。