Question

I'm building a React app that has links pointing to predefined routes.

<a href="/my/react/route/">Click Here</a>

The routes resolve fine, but it's refreshing the page, thereby slowing down app performance. How do I avoid re-rendering the entire page?

Answer 1

使用react-router附带的<Link>标记解决问题。

import React from "react";
import { Link } from 'react-router-dom';

export class ToolTip extends React.Component {
  render() {
    return <Link to="/My/Route"> Click Here </Link>
  }
};

Answer 2

第一个答案是正确的，但我没有找到来自react-router-dom的链接。我的情况就在这里：

awk -F ';' 'NR==FNR{a[++k]=$0; next} {for (i=FNR+1; i<=k; i++) print $0 FS a[i]}' file{,}

abc;173959;172730;def;4186657;4187943
abc;173959;172730;ghi;4703911;4702577
abc;173959;172730;jkl;2243551;2242259
def;4186657;4187943;ghi;4703911;4702577
def;4186657;4187943;jkl;2243551;2242259
ghi;4703911;4702577;jkl;2243551;2242259

Answer 3

您需要：

var list1 = List(1,2,3,4)
list1.patch(2, List(4,1,5), 0)

然后导入您要转到的组件

import { Link } from "react-router-dom"

然后使用这样的链接

import Example from "./component/Example"

这将停止刷新。

请注意，如果<Link to="/Example"> <h4>Example Page</h4> </Link>与您在to="/Example"中指定的路线相匹配，然后它将发送给您。

在此处Reat Training / React Router

了解更多

Answer 4

语义ui反应示例

             <Menu.Item name="NotFound" as={NavLink} to="/dadsadsa" />

Answer 5

如果上述方法不起作用，请检查您是否在定义路由的位置导入了正确的组件。（在我的例子中，我从错误的路径导入了一个同名的组件）

当我使用<a> tag

5 个答案: