微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

如何在这些链接之一下输入下拉功能?

如何解决如何在这些链接之一下输入下拉功能?

如何在这链接之一下输入下拉功能? `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)
};

查看以下链接:

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。