从子组件访问父支持/属性

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>
);

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