react 中的父子组件通信

1.父传子

步骤：

1.父组件传递数据，在子组件标签上绑定属性

2.子组件接收数据，通过参数接收

我们在App.js文件中添加一个子组件，在父组件中使用它，子组件给它绑定一个 name 的属性名

子组件通过props接收参数，并且是一个对象，我们可以通过 props.name 的方式拿到值

我们要注意给子组件命名的话，要首字母大写

父组件可以传递任意的数据：

如：数字，字符串，布尔值，数组，对象，函数，JSX

子组件只能读取props中的数据，不能直接进行修改，父组件的数据只能由父组件修改

尝试修改一下：

就会报错：

意思就是 “num” 是只读属性。

特殊：当我们把内容嵌套在子组件标签中时，父组件会自动在名为 children 的 prop 属性中接收该内容

像这样：

2.子传父

步骤：

核心：在子组件中调用父组件中的函数并传递实参

我们可以理解为，父组件给子组件一个函数，子组件通过这个函数传递给父组件值。

以上就是父子组件通信的知识了，快去练习吧！