React-如何过滤按钮

<div className="searchbar">
  <form>
    <input type="text" placeholder="Search..." onChange={this.searchHandler} />
  </form>
  { 
    this.state.drinks.filter(searchingFor(this.state.term)).map(drink =>
      <div key={ drink.id } >
        { drink.title }
      </div>)
  }
</div>

我可以用这个过滤文本(饮料.title)但我想过滤下面部分的按钮。我现在所拥有的一切有可能吗?抱歉,如果这是一个含糊不清的问题,我是全新的反应,将感谢任何帮助。

<Grid.Column className="left-col" width="3">  
  <Container >      
    <Menu >
      {drinks && drinks.length
        ? <Button.Group vertical widths={drinks.length} >
          {Object.keys(drinks).map((key) => {                 
            return <Button size="large" fluid active={drink && drink.id === drinks[key].id} key={key} onClick={()=>this.getDrink(drinks[key].id)}>
                      {drinks[key].title}
                   </Button>
                 })}
          </Button.Group>
        : <Container textAlign='center'>No drinks found. 
          </Container>
      }
    </Menu>
  </Container>
</Grid.Column>

function searchingFor(term) {
  return function(x) {
    return x.title.toLowerCase().includes(term.toLowerCase()) || !term
  }
}