从子组件访问父道具/属性

Question

我有一个类似于下面代码的组件，我需要一种从 SearchBox 内部获取的方法来了解它的父级 (SearchContainer) 的值具有 withFilter 属性集.

如果 SearchContainer 有办法检测它是否也有 SearchFilter 组件，那就更好了，这样我就可以摆脱那个属性，让 SearchBox 知道还有。

<SearchContainer withFilter>
    <SearchFilter>Filter Orders</SearchFilter>
    <SearchBox/>
</SearchContainer>

Answer 1

作为一种设计方法，SearchContainer 应该有一个道具来决定它是否显示 SearchFilter。

var hasFilter = true;
return (
  <SearchContainer withFilter={hasFilter}>
      {withFilter ? <SearchFilter>Filter Orders</SearchFilter> : null}
      <SearchBox withFilter={hasFilter} />
  </SearchContainer>
);

您应该在代码中 SearchContainer 的 render 中使用 this.props.withFilter。

从子组件访问父道具/属性

Access parent prop / attribute from child component

javascript

attributes

components

reactjs