美文网首页
react父子组件传值

react父子组件传值

作者: 爱祖国 | 来源:发表于2020-07-12 10:08 被阅读0次

1、父==》子组件传值
父组件

import Son from './Son'
<div>
  <Son val = { this.state.name }/>
</div>

子组件

<div>
     这是父传给子的值:{this.props.val}
</div>

2.子==》父组件传值
子组件

clickHandle = ()=> {
      this.props.clickHandle('我是儿子的数据')
}
<button onClick = { this.clickHandle }>修改</button>

父组件

clickHandle = (data)=> {
    this.setState({ name: data })
}
<Son clickHandle = { this.clickHandle } />

相关文章

  • react-父子组件间通信

    React-父子组件间通信 父组件传 值 给子组件, 传 方法 给子组件 子组件接收 值 ,触发父组件的 方法

  • Vue父子组件通信和双向绑定

    本篇文章主要介绍父子组件传值,组件的数据双向绑定。 1. 基础父子组件传值 父子组件传值,这是Vue组件传值最常见...

  • 学习react的第二天(1)

    react组件传值 为了防止数据乱流,react规定,不借助外力,只支持父子传值 父 -> 子 1. 在父元素中,...

  • react 父子组件传值(兄弟传值)

    react中父子组件传值 父向子: 父组件通过自定义属性向子组件传值,子组件通过this.props.属性名接收子...

  • React入门(二)组件

    本节知识点 (1)React组件化 (2)React父子组件传值 (一)组件 在React中组件都是对应的一个个类...

  • 组件之间的传值

    组件之间的传值,包括父子组件传值,兄弟组件之间的传值,其中父子组件包括父组件向子组件传值和子组件向父组件传值,现在...

  • vue 父子组件传值 $on sync v-model

    1、正常的父子组件传值2、使用sync 实现父子组件传值3、使用v-model实现父子组件传值

  • React父子组件间的传值的方法

    在单页面里面,父子组件传值是比较常见的,这篇文章主要介绍了React父子组件间的传值的方法,小编觉得挺不错的,现在...

  • (VUE3) 四、组件传值(父子组件传值 & 祖孙组件传值 &v

    1.父子组件传值 vue2中的父子组件传值:父组件: 子组件: vue3中的父子组件传值: 还是用props接收父...

  • vue、react对比

    一、父子通信 1. 父组件通过props向子组件传值 vue:父组件 子组件接收 react:父组件: 子组件: ...

网友评论

      本文标题:react父子组件传值

      本文链接:https://www.haomeiwen.com/subject/jcfgcktx.html