(5)父子组件间通信

本节目标：理解“(5)父子组件间通信”的核心思路，并能把它用于实际开发或面试表达。

说明：原 OneNote 中有图片引用，但图片未包含在导出目录中；本页保留了可用的文字与代码内容。 父组件向子组件通信

父组件通过向子组件传递
```
 props
```
来通信。
在父组件中可以用 refs 引用子组件，然后调用子组件的实例方法，并向方法中传入数据。演示代码：一、使用props 父组件 App.js：

import React, { Component } from "react";
import Sub from "./SubComponent.js";
import "./App.css";
export default class App extends Component {
    render() {
        return (
            <div>
                <Sub title="

今年过节不收礼

" />
            </div>
        )
    }
}
//

子组件

 SubComponent.js

：

import React from "react";
const Sub = (props) => {
    return (
        <h1>
            { props.title}
        </h1>
    )
}
export default Sub;

二、使用refs

(5)父子组件间通信 ​

(5)父子组件间通信