- Objective:
- Breadcrumb:
# 概念阐释
## 语义
传递一个事件处理程序作为 prop。
## 语法
# 实例
1. 在 **Talker.js**文件中，定义事件处理程序，写在同一函数内`talk()`
2. 在 **Talker.js**文件中，传递事件处理程序到函数组件`<button />`，prop可以任意命名，传递函数时用`{}`
3. 在 **Button.js**文件中添加事件处理程序`onClick`
```jsx
//Talker.js,button文件是talker 文件的子级
import React from 'react';
import Button from './Button';
function Talker() {
function handleClick() {
let speech = '';
for (let i = 0; i < 10000; i++) {
speech += 'blah ';
}
alert(speech);
}
return <Button onClick={handleClick} />;// 相当于name="iphone"
}
export default Talker;
```
```jsx
//Button.js
import React from 'react';
function Button(props) {
return (
<button onClick={props.onClick}> //相当于 props.name
Click me!
</button>
);
}
export default Button;
```
# 相关内容
# 参考资料