如何在物料界面的SearchAppBar中添加搜索功能？

import React, { useState } from 'react';
import { AppBar, Toolbar, InputBase, IconButton } from '@material-ui/core';
import SearchIcon from '@material-ui/icons/Search';

const SearchAppBar = () => {
  const [searchKeyword, setSearchKeyword] = useState('');

  const handleInputChange = (e) => {
    setSearchKeyword(e.target.value);
  }

  const handleSearch = () => {
    // 在这里执行搜索操作，可以根据需要调用后端API获取搜索结果
    console.log('搜索关键词:', searchKeyword);
  }

  return (
    <AppBar position="static">
      <Toolbar>
        <InputBase
          placeholder="搜索"
          onChange={handleInputChange}
        />
        <IconButton onClick={handleSearch}>
          <SearchIcon />
        </IconButton>
      </Toolbar>
    </AppBar>
  );
}

export default SearchAppBar;