子类组件向父函数组件传值:参数/布尔值
时间: 2023-07-21 11:34:18 浏览: 107
可以通过在子组件中调用父组件传递的函数,并将需要传递的参数或布尔值作为参数传入来实现子组件向父组件传值。
例如,假设有一个父组件 Parent 和一个子组件 Child,Parent 传递了一个名为 handleChildClick 的函数给 Child,Child 中有一个按钮,当点击该按钮时需要将一个参数传递给 Parent:
```jsx
// Parent.jsx
import React from "react";
import Child from "./Child";
function Parent() {
function handleChildClick(value) {
console.log(`Received value ${value} from child component`);
}
return <Child handleClick={handleChildClick} />;
}
export default Parent;
// Child.jsx
import React from "react";
function Child(props) {
function handleClick() {
props.handleClick(true);
}
return <button onClick={handleClick}>Click me</button>;
}
export default Child;
```
在上面的代码中,Parent 组件中定义了一个名为 handleChildClick 的函数,并将它作为 handleClick 属性传递给 Child 组件。Child 组件中的 handleClick 函数被触发时,会调用 props.handleClick 并传递一个值 true 给它,从而实现了子组件向父组件传值的功能。
阅读全文