无法进入 select/option 菜单中的所需路径

Question

我的代码中有一个 select 菜单。它有两个选项。通过单击每个选项，我想转到同一站点上的另一个页面。这是我的代码：

import React, { useState, useEffect } from 'react'
import { useNavigate } from 'react-router-dom'

const navigate = useNavigate()

<div className="flex justify-center">
                    <select className="form-select form-select-sm aria-label=".form-select-sm example">
                    <option value="1" onChange={() => navigate('/')}>one</option>
                    <option value="2" onChange={() => navigate('/ext')}>two</option>
                    </select>
                </div>

但是当我 select 每个选项时，它不会继续到所需的路径。怎么了？

Answer 1

尝试使用 onClick 事件而不是 onChange，onChange 应该用在 select 元素上，而不是用在选项元素上。因此，要么将选项包装在 select 中并使用 onChange，要么尝试在选项上使用 onClick。

无法进入 select/option 菜单中的所需路径

cannot proceed to the desired path in select/option menu

drop-down-menu

reactjs