美文网首页框架学习RN
react 组建件数据传递

react 组建件数据传递

作者: 走走婷婷1215 | 来源:发表于2017-03-01 12:00 被阅读34次

父传子:最简单也是最基础的一种数据传递方式

父组件:

图片.png

父组件中调用子组件并将数据放入 datas 中传给子组件,子组件通过 props 进行调用。

子传父:
1、子组件调用父组件的方法:
父组件:

图片.png

子组件:

图片.png

2、ref 形式:
在父组件中调用子组件 CarItem,并命名 ref 属性值为 changeState

图片.png

在父组件中合适的地方触发调用子方法的方法,然后开始与子组件通信,调用子组件中对应的方法。

图片.png

子组件:

图片.png

同级组件数据传递:
1、以父级作为中介进行传递。
2、pub /sub
A组件:

图片.png

B组件:

图片.png

相关文章

  • react 组建件数据传递

    父传子:最简单也是最基础的一种数据传递方式 父组件: 父组件中调用子组件并将数据放入 datas 中传给子组件,子...

  • react 组件化

    react 组件化理解 1.组建的封装(视图+数据+数据驱动视图的变化) 2.组建的复用 (props传递/复用)

  • 七. React的上下文(Context)

    在某些场景下,想在整个组件数中传递数据,但却不想手动地在每一层传递属性。可以直接在React中使用强大的“cont...

  • react组件之间的通讯

    背景故事很简单:父组件对子组件传递信息,直接使用props即可;子组建对父组件传递信息,参考自React 组件之间...

  • 06-Vue组件数据传递父传子

    组件数据传递父传子

  • React系列(七)——Redux的使用

    前言 当我们的前端项目功能点比较多,组件关系比较复杂时,单纯的使用React原生的方法进行组件数据的传递实现起来可...

  • React组建

    复合组建

  • react

    creat-react-app react/script start 定义组建 function heoo(){}...

  • React Native 第三方组件之--多媒体类

    react-native-camera 相机组件 ???? react-native-video 视频组建 ???...

  • React_组建

    这次我们来学习React中的组件。组件是React的核心。 根据React官网的介绍,组件可以将UI切分成一些独立...

网友评论

    本文标题:react 组建件数据传递

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