我有一个元素列表，单击每个项目，我想显示详细信息组件，并且如果用户访问直接URL，我想显示包含与url相关的数据的详细信息组件
列表组件在下面，并且数据是通过本地文件中的数组对象提供的。
在react中，我们有Switch路由，我们在其中基于动态路径值传递参数，请提出如何在Next JS中实现这一点。 我看到了各种示例，其中使用同构提取从API获取数据，但是不确定如何将本地选择的对象传递给组件。
数据导入到组件中
import {data} from '../data/..'
并作为道具传递了以下组件，并在其上单击以显示详细视图。
<Link href="/p/[id]" as={/p/${news.id}} passHref>
<a className="headLineTextLink">{news.title}</a>
</Link>