如何解决如何在这些链接之一下输入下拉功能?
如何在这些链接之一下输入下拉功能? `import React,{ Component } from 'react'; 从 'react-router-dom' 导入 {Link};
<Text>
You have {" "}
{remaining}$ {" "}
from{" "}
{total}$
<Text>
解决方法
您的意思是使用下拉选择器,例如 Material UI 的 Select 组件,并且每个选择都会导致您应用中的不同位置?
Select 组件通常有一个 onChange
,同样是 Material 示例中的示例:
<Select
labelId="demo-simple-select-label"
id="demo-simple-select"
value={age}
onChange={handleChange}>
<MenuItem value={10}>Ten</MenuItem>
<MenuItem value={20}>Twenty</MenuItem>
<MenuItem value={30}>Thirty</MenuItem>
</Select>
在 onChange
方法中,您需要做一些逻辑来确定去哪里,然后使用 React Router 的 history
对象去那里。
获取 history
对象:
const history = useHistory()
进入 onChange
事件处理程序:
const handleChange = (event) => {
const uri == ... use event.target.value to determine the URI to go to
history.push(uri)
};
查看以下链接:
- Material UI 选择 - https://material-ui.com/components/selects/
- 反应路由器历史对象 - https://reactrouter.com/web/api/history
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。