在你的组件中尝试这样的事情：

let { scrollToSection } = useParams();
svetskoRef = React.createRef();

useParams() 允许您访问 :svetsko。当组件加载时，您可以使用 scrollToSection 在页面的不同部分之间导航。scrollRef 用于访问要滚动到的 DOM 元素。

window.scrollTo(0,scrollRef.offsetTop)

标记看起来像这样：

<div className="card" ref="svetskoRef">
  <Link to="/news/:svetsko">
    <div className="card-header">
      <h3>Artistic gymnastics world championship</h3>
     </div>
   </Link>
</div>

您只需要一条路线，例如

<Switch>
    <Route exact path='/news' component={News} />
</Switch>

你可以给链接

 <Link to={{
  pathname: '/news',
  state: { news : yourNewsName } // you can pass svetsko here
}}> 

 <div className="card-header">
  <h3>Artistic gymnastics world championship</h3>
 </div>

</Link>

您可以在新闻页面中访问此状态，例如

<div>{  props.location.state !== undefined ? props.location.state.news : '' }</div>

在获得像 eyof 这样的新闻类型后：

步骤1 ：

   you can create on functional component which takes argument as your
 data and return your new post jsx with your data.

第2步 ：

   So,when you get your eyof in your page then you are going to call 
this function and pass your data related to your eyof and that function 
return your new post to your page.

好的，我找到了一个非常好的库作为解决方案，它被称为 react-scroll 并且它可以选择将您需要的链接包装在之前定义的滚动链接中，并包装您希望它作为页面的特定部分链接的组件带有 id 的元素作为参数提供给滚动链接...如果您需要它，请尝试一下。