你为什么不用这个来代替一个新的包呢？自动完成程序就是这么做的。

const [receivers, setReceivers] = React.useState<string[]>([]);

    import Autocomplete from '@mui/material/Autocomplete';
         <Autocomplete
            multiple
            onChange={(e, value) => setReceivers((state) => value)}
            id="tags-filled"
            options={top100Films.map((option) => option.title)}
            defaultValue={[top100Films[13].title]}
            freeSolo
            renderTags={(value, getTagProps) =>
              value.map((option, index) => (
                <Chip variant="outlined" label={option} {...getTagProps({ index })} />
              ))
            }
            renderInput={(params) => (
              <TextField
                {...params}
                variant="filled"
                label="freeSolo"
                placeholder="Favorites"
              />
            )}
          />

import React from 'react'
import { MuiChipsInput } from 'mui-chips-input'

const MyComponent = () => {
  const [chips, setChips] = React.useState([])

  const handleChange = (newChips) => {
    setChips(newChips)
  }

  return (
    <MuiChipsInput value={chips} onChange={handleChange} />
  )
}

来源：https://github.com/viclafouch/mui-chips-input

• 同时支持React 17 / 18和MUI V5*

使用Autocomplete的freeSolo属性，只需将options属性设置为一个空数组：

<Autocomplete
    multiple
    freeSolo
    value={value}
    options={[]}
    renderTags={(value, getTagProps) =>
      value.map((option, index) => (
        <Chip label={option} {...getTagProps({ index })} onDelete={()=> /* remove option from value array */} />
      ))
    }
    renderInput={params => (
      <TextField
        {...params}
        variant="outlined"
        label="Add Chip"
        placeholder="Type and press enter"
      />
    )}
  />