Как вывести запрашиваемые данные из JSON (Reactjs api call)?

Доброго времени суток.
Начал изучение API call на ReactJs.
Данные из JSON вывел , без каких либо проблем, но вот теперь хочу сделать вывод данных по запросу который вводят в Input.
И не совсем понимаю, как это в Reactjs можно реализовать.
Вот код :

сlass SearchHub extends Component{

    constructor(props) {
        super(props);
        this.state = {
            error: null,
            isLoaded: false,
            items: []
          };
        }
    

    componentWillMount(){
        fetch(`http://localhost:8080/api/users/`)
        .then((response) => response.json())
        .then(
            (result) => {
              this.setState({
                isLoaded: true,
                items: result.items
              });
            },
            (error) => {
              this.setState({
                isLoaded: true,
                error
              });
            }
          )
        .catch(error => console.log('parsing failed', error))
    }

    handleSumbit(e){
        e.preventDefault();
        this.componentDidMount(this.refs.name.value);
    }

 

    render(){
        const { error, isLoaded, items } = this.state;
    if (error) {
      return <div>Error: {error.message}</div>;
    } else if (!isLoaded) {
      return <div>Loading...</div>;
    } else {
      return (
      <div>
        <div className="searchlanding">
            <div className="input-button-form">
            <Input 
                leftIcon={<Icon name="search" />} 
                width="1000px" 
                placeholder="Введите Фамилию и Имя"
                /> {' '}
                <Button use="primary">Найти</Button>
            </div>
        </div>
        <div className="table-result">
          <ul>
            {items.map(item => (
              <li key={item.name}>
                  {item.rating.totalLove}
                  <img src={item.avatarUri} alt="Фото" className="round-photo"/>
                  {item.name} 
              </li>
            ))}
          </ul>
        </div>
    </div>
        );
    }
  }
}

export default SearchHub;

На данный момент при загрузке страницы он выводит вообще все данные которые имеются в JSON.
В JSON поиск идет только по имени и фамилии которые находятся в "name".
Подскажите, как это можно реализовать?
Буду рад примерам на codepan или альтернативным вариантам!