Reactjs 如何在<；链接到={}>；并使用[react/typescript]从另一个组件获取它们

我想看看如何使用typescript在

中传递id。然后在

SeriesSection

组件中获取链接的id

SerieComponent.tsx

从“React”导入React；
从“react router dom”导入{Link}；
从“../../interfaces/Serie/Serie”导入Serie；
类型T={
意甲：意甲
};
const SerieComponent:React.FC=（{serie:{id，title，sinopsis，poster，rating，year，extra}}）=>{
让channel=extra.map（x=>{return x.channel}）；
返回(


{年}{频道}
{title}
{sinopsis}

)
};
导出默认系列组件；

这个组件是我想要获取链接id的地方

import React from 'react';

const SerieSection: React.FC = () => {
  return(
    <div>

    </div>
  )
};

export default SerieSection;

从“React”导入React；
常量序列选择：React.FC=（）=>{
返回(
)
};
导出默认序列；

如果你注意到我已经提到了路线

从“React”导入React；
从“react router dom”导入{交换机、路由、重定向、链接}；
从'@material ui/core/styles'导入{makeStyles}；
从“@material ui/core/AppBar”导入AppBar；
从“@material ui/core/Toolbar”导入工具栏；
从“@material ui/core/Typography”导入排版；
从“@material ui/core/Button”导入按钮；
从“@material ui/core/IconButton”导入IconButton；
从“@material ui/icons/Menu”导入菜单图标；
从“../Home/index”导入Home；
从“../About/index”导入关于；
从“../Footer/index”导入页脚；
从“../SerieSection/index”导入SerieSection；
从“./styles”导入useStyles；
需要（'../db/index.ts'）；
常量应用程序：React.FC=（）=>{
const classes=useStyles（）；
返回(
家
关于
)
}
导出默认应用程序；

---

如果第二个组件是class，请不要忘记

这个

关键字

我必须参考

RouteComponentProps

import React from 'react';
import { RouteComponentProps } from 'react-router-dom';


interface State {
  id: string;
}

interface Props extends RouteComponentProps<State>{

}

const SerieSection: React.FC<Props> = (props) => {
  let id = props.match.params.id;
  return(
    <div>
    <h1>{id}</h1>
    </div>
  )
};

export default SerieSection;

从“React”导入React；
从'react router dom'导入{RouteComponentProps}；
界面状态{
id：字符串；
}
接口道具扩展了RouteComponentProps{
}
常量序列：React.FC=（道具）=>{
设id=props.match.params.id；
返回(
{id}
)
};
导出默认序列；

您在这方面遇到的具体问题是什么？构建to=只是一个字符串模板的问题，文档中的示例当然显示了如何访问路径参数。如何从SeriesSection组件中获取id我是新使用react/typescript的是的，我知道，但在typescript中它是不同的。具体以什么方式？您在应用它时是否遇到了特定的问题？打个招呼。在你发布的代码中，你似乎没有尝试任何你想做的事情。

<Link to={{
  pathName: "/yourpathname",
  someProp:{foo:"bar"}
}}>Your Path</Link>

console.log("test: ", props.location.someProp)

import React from 'react';
import { RouteComponentProps } from 'react-router-dom';


interface State {
  id: string;
}

interface Props extends RouteComponentProps<State>{

}

const SerieSection: React.FC<Props> = (props) => {
  let id = props.match.params.id;
  return(
    <div>
    <h1>{id}</h1>
    </div>
  )
};

export default SerieSection;