将存储在子组件内函数中的值传递给 React 中的父组件

Question

下面是我的代码。

子组件

  const onSave = () => {
    var val = value
    props.onSave();
  }

<div onClick={() => { onSave() }}>
            <CheckButton variant="contained" text-align='center' />
          </div>

父组件

export const Card = (props) => {
    const onSave = (val) => { [I WANT TO ACCESS val within here] }
}


<TextInputContainer onSave={() => onSave()} />

有什么方法可以访问父组件内的变量val吗？ 代码被大量截断。 实际代码使用 Redux。

Answer 1

react 的createRef帮助你访问 react 组件的值：

参考（ https://pt-br.reactjs.org/docs/hooks-reference.html ）

constructor () {this.CheckButtonRef = createRef()}
onSave = () => {props.onSave(this.CheckButtonRef.current.value)}
<CheckButton ref = {this.CheckButtonRef}/>