时间戳

首页 > 解决方案 > 如何在reactjs中正确地从页面路由到另一个页面

javascript - 如何在reactjs中正确地从页面路由到另一个页面

问题描述

我正在尝试使用链接路由到编辑页面

 <Link
    to={`/update/${ad._id}`}
    className="btn btn-xs btn-round btn-o btn-green dropdown-toggle"
    >
   <span className="fa fa-pencil"></span>
Edit
 </Link>

在目标组件中，我正在componendDidMount使用如下自定义函数加载一些 javascript 文件

this.loadScript('js/jquery-2.1.1.min.js');

资源

loadScript(src) {
        const script = document.createElement("script");
        script.src = src;
        script.async = false;
        document.body.appendChild(script);
    }

然而，当页面加载时，我可以在控制台中发现许多错误，类似于

GET http://localhost:3000/update/js/bootstrap.js net::ERR_ABORTED 404 (Not Found)

我猜它应该已经加载http://localhost:3000/js/bootstrap.js，而不是注意到文件加载的路径类似于这种模式/somepage但不是/somepage/:id

这是正在使用的路由器

可能是什么问题 ？

标签： javascriptreactjs

解决方案

只是改变

this.loadScript('js/jquery-2.1.1.min.js');

至：

this.loadScript('/js/jquery-2.1.1.min.js'); // note the beginning slash

在路由概念中，当不以斜线开头的路由被认为是“相对路径”，但如果它有一个起始斜线，它将被用作“绝对路径”。

推荐阅读