Question

：）

我尝试重新加载浏览器（使用location.reload();），如果用户点击<Link>获取相同的路径，那么它就已经存在。

示例：

我有一个菜单：

- Home - Contact - About

当用户点击“联系人”时，他会转到＆＃39; / contact＆＃39;。但我已经在＆＃39; / contact＆＃39;然后点击“联系人”＃39;在菜单中，页面重新加载。

可以这样做吗？

我正在尝试：

<Link onClick={this.handleClick} to="contact">Contact</link>

handleClick(){
    var currentRoute = 'React-Route path';
    var linkRoute = 'link path';

    if (currentRoute === linkRoute)
        location.reload();
    } else {
        //do default transition
    }
}

但我不知道我需要在“当前路线”中声明什么。和＆＃39; linkRoute＆＃39;。：（

Answer 1

您不应该重新加载页面。这是一个非常糟糕的主意。而是禁用这样的链接：

如果您在主页上，您的链接将如下所示

<a href="/home" data-disabled="true">home</a>
<a href="/contact" data-disabled="false">contact</a>
<a href="/about" data-disabled="false">about</a>

然后在handleClick()函数中，您可以执行此操作。

handleClick(e){
    e.preventDefault();
    var disabled = $(e.currentTarget).data('disabled');
    if (!disabled){ 
        //do redirect
    }
}

基本上在链接上有一个数据属性，用于指定是否已禁用（仅在当前页面上禁用它），然后仅在其他页面上重定向

在完全相同的页面上重新加载页面将导致您丢失用户已完成的所有状态和进程，这不需要发生。它还可以减少服务器上的流量以获得新的页面加载（也就是您需要加载的页面加载所需的任何数据）。

Answer 2

您可以使用window.location.href获取当前网址。然后你可以进行比较。

如果点击相同的路径，请重新加载页面

2 个答案: