如何使用 reactjs 获取父组件中的值？答案

【问题标题】：how to get the value in Parent component using reactjs?如何使用 reactjs 获取父组件中的值？
【发布时间】：2020-04-15 12:04:00
【问题描述】：

我是新手，我想从子组件 (salary.js) 到父组件 (App.js) 获取 range 值。我无法找出如何将道具传递给 App 组件。我的目标是获取存储在salary.js 中的范围值到price 中的App.js，以便发布该值。

任何人都可以帮助我吗？提前致谢

【问题讨论】：

也许对父组件的回调对您有用 (stackoverflow.com/questions/32635897/…)。如果子组件的深度超过一层，最好使用 React 上下文 (reactjs.org/docs/context.html)。

标签： reactjs

【解决方案1】：

你可以使用回调函数。

PaterentComponent  {

  const myCallbackFunction = (value) => {
  console.log(value);
  }

  return (
    <ChildComponent callback={myCallbackFunction}> </ ChildComponent>
  )
}

ChildComponent {

/// dothmth

   return <button  onClick{props.myCallbackFuntion("I'mcallback")}>CallbackFunciton</button>

}

【讨论】：

【解决方案2】：

你不能将 props 从组件传递给它的父组件。您需要将 rangeValue 存储在 App 组件中。这被称为“提升状态”。您的 App 组件应传递 rangeValue 和回调以将其修改为 Salary。 Salary 会显示它从 props 收到的值，并在需要更新值时调用回调

【讨论】：