Réagir-Routeur est l'actualisation d'une page quand je suivre un itinéraire à l'aide de <a> tag

Je suis en train de construire une Réagir application qui a des liens pointant vers des routes.

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

Les routes de résoudre bien, mais c'est l'actualisation de la page, ce qui ralentit les performances de l'application. Comment puis-je éviter la ré-rendu complet de la page?

InformationsquelleAutor Rick | 2015-11-27
  1. 48

    Résoudre le problème en utilisant le <Link> tag inclus avec réagissent-routeur.

    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>
  }
};
    • N'vrai pour la génération statique de site ainsi?
    • Que diriez-NavItem href dans réagissent-bootstrap? <Nav bsStyle="onglets"> <NavItem href="/plan"> </NavItem> </Nav>
    • NavItem agit comme un <un href..> il va recharger la page
    • Est-ce à dire à l'aide de a href est complètement découragé pour Réagir SPA, et remplacez-le toujours par link lors de la prise de base des liens? par exemple, a href causes rechargement complet dans tous les cas?
    InformationsquelleAutor Rick
  2. 2

    Première réponse était la bonne, mais je n'ai pas trouvé de Lien de réagir-routeur-dom. Il était dans mon cas ici:

    import { Link } from 'react-router';
    • Les différentes versions de réagir-routeur: version 4: import { Link } from react-router-dom version 3 or before: import { Link } from react-router
    • il n'est pas disponible dans la version antérieure, mais avec la version 4 et ci-dessus, vous pouvez le faire import { Link } from 'react-router-dom'
    InformationsquelleAutor Janne Harju