Javascript 如何链接到包含从下拉列表中拾取的项目的页面

我正在为我的web应用程序使用react select 我有一个自动填充的下拉列表，当我点击输入时，我会看到一个来自API的所有汽车项目的列表，但我需要输入所需的项目并重定向到该详细信息页面。 我应该为此创建路线吗

看一看:

当我点击宝马时，我需要进入宝马详情页面。 如果它只是一个简单的汽车项目，我会创建一个按钮下和链接

<Link  className='btn-item auction-btn mr-2' to={`/carDetails/${item.id}`}>Details</Link>.

详细信息。

使用路由：

 <Route
            exact
            path="/carDetails/:id"
            render={({ match }) => (
              <CarDetails item={data.find((item) => String(item.id) === String(match.params.id))} />
            )}
          />

(
字符串（item.id）==字符串（match.params.id））}/>
)}
/>

---

但这是react select库，我必须筛选它的组件，然后才能转到我需要的页面。

您可以执行

历史记录。在react select的更改处理程序中按下
。例如：

export default function MyComponent() {
  const [value, setValue] = useState()
  const history = useHistory()

  function handleChange(newValue) {
    setValue(newValue)
    history.push(`/carDetails/${newValue.id}`)
  }

  return (
    <Select
      value={value}
      options={options}
      onChange={handleChange}
    />
  )
}

导出默认函数MyComponent（）{
const[value，setValue]=useState（）
const history=useHistory（）
函数handleChange（newValue）{
设置值（新值）
history.push（`/cardetals/${newValue.id}`）
}
返回(
)
}
此外，如果您离开当前组件并使用
历史记录重定向到其他组件，则可能不需要更改处理程序中的
设置值（newValue）
。推送
。idk为什么（
/carDetails/${newValue.id}
）未定义{标签：“法拉利加利福尼亚”，值：“法拉利加利福尼亚”}标签：“法拉利加利福尼亚”值：“Ferrari California”未定义的是当它被重定向到
carDetails/${newValue.id}
时，这意味着您在传递给
react select
的
options
中没有
id
。之后，您可以将
id
添加到
选项中吗。