Reactjs 反应路由器dom链接。如何将ID放入链接的路径中

因此，我正在映射一组用户，每个用户都有一个唯一的ID。我想为链接创建一个路径，该路径将包括用户的唯一ID，具体取决于单击的链接。以下是我迄今为止尝试过的内容（由于某些原因，Link不允许我使用模板文本）

import React，{useffect，useState}来自“React”；
//从“../api/axiosWithAuth”导入{axiosWithAuth}；
//从“axios”导入axios；
从'react redux'导入{connect}；
从“react router dom”导入{useParams，Link}；
从“../actions/index”导入{fetchUsers}；
//获取对/api/users的请求——将返回用户数组
const ListUsers=props=>{
const[data，setData]=useState（[{username:'hello world！']）；
const params=useparms（）；
常量路径=`/Profile/${params.id}`
//函数myFunction（id）{
//警报（项目id）；
// }
useffect（（）=>{
props.fetchUsers（）；
}, [])
返回(
{props.users.map（项=>{return(
用户名：{item.Username}
名称：{item.firstName}
ID:{item.ID}
电子邮件：{item.Email}
)})}
)
}
常量mapStateToProps=状态=>{
返回{
用户：state.users，
用户：{}，
registerSuccessMessage:“”，
用户_故事：{}，
孤岛加载：false，
错误：null
}
}
导出默认连接（MapStateTops，{fetchUsers}）（ListUsers）；
//获取对/api/users/：id的请求——将返回由id指定的用户
... 

对于搜索参数，可以传递对象

<Link to={{
    pathname: "/Profile",
    search: "?key=value",
  }}>
   ...
</Link>

...

---

您只需用大括号将路径括起来，然后使用所需的任何javascript以及模板文本

<div>
            {props.users.map(item=>{return(
            <Link path={`/Profile/${item.id}`}>
                <div className="UsersCard">Username: {item.username} <br /> Name: {item.firstName} <br /> ID: {item.id} <br /> Email: {item.email} </div>
            </Link>
                )})}
        </div>

{props.users.map（项=>{return(
用户名：{item.Username}
名称：{item.firstName}
ID:{item.ID}
电子邮件：{item.Email}
)})}

id值最好包含在链接路径中

<Link path={`/Profile/${item.id}`} params={{id: item.id}}>

---

无论用户从何处获得链接，它都能让事情顺利进行。

哦，天哪，我忘了带花括号了。这就是为什么它不允许我使用模板文本。愚蠢的错误，非常感谢你！是的，我缺少花括号，这就是为什么它不允许我使用模板文本。非常感谢你，KR！很高兴知道！我只是错过了我的卷发背带，谢谢你的建议，虽然太鲁卡米！

<Link path={`/Profile/${item.id}`} params={{id: item.id}}>