Reactjs 如何使用动态路由在页面中触发相同的.js？

我有多条路线，例如：

/解决方案/

/解决方案/网络开发/

/特征/

/功能/flexbox/

/插件/

/插件/永久链接/

等等

我想为所有这些路由运行相同的文件（

abc.js

）。我已经检查了Next.js的部分，但根据该部分，我的理解是我需要创建多个目录，并在多个实例上复制同一个文件

是否有任何方法可以为所有定义的路由或整个站点运行单个文件

---

编辑：我知道有一种方法可以通过创建实现这一点，但我希望在不创建外部服务器的情况下实现这一点。

我找到了解决这一问题的方法。这可以使用

next.config.js

文件来完成。您唯一需要的是页面URL，然后您可以应用同一个文件，甚至可以添加条件以使用多个文件进行应用

以下是示例代码：

module.exports={
exportPathMap:异步函数(
默认路径图，
{dev，dir，outDir，distDir，buildId}
) {
常量路径={}；
常量页面URL=[
“/solutions/”，
“/solutions/web development/”，
“/features/”，
“/features/flexbox/”，
“/plugins/”，
“/plugins/permalink/”
];
var loopInit=0；
var loopCount=pagerurls.length；
var url=''；
对于（loopInit=0；loopInit

在上面的示例中，我在

pageURLs

变量中硬编码了URL。您可以在其中传递动态值，如从WordPress获取永久链接，从Drupal或从任何其他CMS或无头CMS获取URL别名等

在交换机的情况下，我在

/solutions/

和

/features/

上应用了不同的模板。对于其余的URL，我将应用一个模板

注意：

page:'/'

参考页面目录下的

index.js

，

page:'/solutions'

参考页面目录下的

solutions.js

，依此类推。它可以根据开发者的选择进行更改/变化

我已经在

9.1.4

版本的Next.js上测试了这个解决方案。有关更多详细信息，请参阅Next.js文档

---

已编辑：此解决方案适用于服务器端渲染和

Next.js

导出。

不确定“Next/router”，但使用“react dom router”不会有问题。使用Hoc模式如何？它在非静态的生产环境中不起作用pages@Meliborn您正在使用哪个NEXT.js版本？正如我在回答中提到的，我已经在9.1.4版本的NEXT.js上测试了这个解决方案，这个解决方案可能不再适用于较新的版本。10+，但这是有必要的