我嘗試了這個，甚至在輸入要搜索的值之前，所有產品都會出現在搜索欄下方，如何僅在搜索時顯示產品。請幫忙提前致謝搜索欄.jsimport React, { Component } from 'react'import {storeProducts} from '../data';import Product from './Product';import styled from 'styled-components';export default class SearchBar extends Component { constructor(){  super();  this.state={   search: '',    }; } updateSearch(event) { this.setState({search:event.target.value.substr(0,20)}) } render() {  let filteredProducts = storeProducts.filter(   (product) => {    return product.title.indexOf(this.state.search) !== -1;   }  );  return (   <SearchWrapper>   <input type="text" value={this.state.search} onChange={this.updateSearch.bind(this)} placeholder="search"/>   {filteredProducts.map((product) => {    return <li> <Product product={product} key={product.title}/></li>   })}   </SearchWrapper>  ) }}const SearchWrapper = styled.div`background:#f6f6f6;padding: 30px 200px;input{ border:1px solid #76bd05; width:40rem;}li{ height 50px; list-style:none;}`;