Javascript react router dom-当用户单击按钮时，LinkAnchor标记中的路径不能被隔离

我有一个按钮，用于将用户导航到新选项卡和新路径。 但不知何故，LinkAnchor标记中指定的路径无法与原始路径隔离。 如何将用户引导到正确的路径

• 例如，按钮位于下面的页面上，路径为： 'http://localhost:3000/workspace/test1ws/video/rooms' 带链接标签：

  <Button onClick={()=>handleConferenceClick({item})}>
   <Link to ={item.video_room_url} target ='_blank'>
        Join meeting
   </Link>
  <Button>
  

  handleConferenceClick（{item}）}>
  参加会议
  

  当我单击按钮时，会弹出包含以下路线的新选项卡： 'http://localhost:3000/workspace/test1ws/video/https://meet.jit.si/de1d6388be"
  我对路线的预期： 'https://meet.jit.si/de1d6388be"

子-父组件结构为： DashboardContainer.js->VideoContainer.js->VideoJoinRoom.js

提前感谢您的意见和帮助

VideoJoinRoom.js中的代码：

const VideoConferenceRoom=（{currentWorkspace，handleClick}）=>{
const[currentVideoRoom，setCurrentVideoRoom]=useState（[]）；
useffect（（）=>{
const getVideo=async（）=>{
const body={currentWorkspace}；
试一试{
const getVideoInfo=等待获取(`http://localhost:4000/workspace/${currentWorkspace}/video/rooms`{
方法：“张贴”，
标题：{
“内容类型”：“应用程序/json”，
“x-access-token”：localStorage.getItem（“token”）
},
body:JSON.stringify（body）
})
const response=wait getVideoInfo.json（）；
//通过…response.videoRooms，您可以访问返回的数组中的每个元素
setCurrentVideoRoom（[…响应.视频室]）
控制台。日志（响应。视频室。视频室）；
//控制台日志（当前视频室）；
}捕获（e）{
控制台错误（e.message）；
}
}
getVideo（）；
//eslint禁用下一行react HOOK/deps
},[]);
常量handleConferenceClick=（项目）=>{
把手舔（项目）
}
/**造型*/
const useStyles=makeStyles（（主题）=>({
/**纸牌*/
卡片布局：{
宽度：“6rem”，
填充：“0.5雷姆”
},
/**印刷术*/
印刷字体：{
边距：“1rem”
},
/**桌子*/
桌面容器：{
边距：“1rem”
}
}));
const classes=useStyles（）；
返回currentVideoRoom&¤tVideoRoom。长度>1(
加入在此工作区中进行的视频会议！
{currentVideoRoom.map（（项目）=>(
房间{item.id}
房间名称：
{item.video\u room\u name}
会议室密码（使用此密码加入会议！）：{item.video_Room_pw}
文件室url:{item.video\u Room\u url}
handleConferenceClick（{item}}>
{/*  */}
参加会议
))}
):(
现在没有视频会议。
)
导出默认视频会议室