react中 父子级传参

React 中如何父子级传参呢。

 

 

1､子传父

    

    子：这里的 onChoose 是父级里面的名字，over 是要带进去的参数。if(onChoose) 是判断是父级是否调用这个方法。如果调用就把数据传过去。

     

 

    父：在调用的组件中加入 onChoose ={ } 这个方法名，然后里面写个方法，通过 this.props拿到子级里面的参数 

    

 

 

2､父传子

 

这里面的EditableInputNumber 是调用的 ant 里面的 inputNumber 组件。我要在审核状态下这里不编辑。

 

 

在这里，本来 disabled 是默认为 false ,就是没有被禁止。我们要先给它定义一个变量。随便用什么名字，父级传递经全子级的一个变量，然后传进来判断。

 

 

 

场景一：三个页面（三个组件），放到一个页面中，用 tabs 切换的形式。

需求：A、B、C 三个页面，放到 One 页面中，A页面（点击 table 每条的详情跳转到 C 页面中且要把每条中的 telephone 参数传进去。

 

A页面：结构                                                           One 页面：结构

                             

 

子传父
先从 TableView 中点击详情，值传到父级 MainView 中的 index。
再把 MainView 中的 index 传给父级 index。
index 再传给 One 页面
One 页面接子页面传过来的值，
父传子
One 页面中 把接收的值，传给 C 页面，用父传子的方式，传给 C 页面中 index，如上图画框位置，C页面 index 接收如下：
C 页面中 MainView 的 index 接收值
C 页面中 MainView 的 SearchView 的 index  接收 MainView 传过来的值