首页 > 语言 > JavaScript > 正文

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

2024-05-06 15:11:52
字体:
来源:转载
供稿:网友

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组件之间的参数传递(详解)就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持错新站长站。

发表评论 共有条评论
用户名: 密码:
验证码: 匿名发表

图片精选