React js — как предотвратить перезагрузку страницы после нажатия на ссылку. Прямо сейчас вся страница обновляется при нажатии на ссылку

#javascript #reactjs #hyperlink #reload #window.location

#javascript #reactjs #гиперссылка #перезагрузите #окно.Расположение

Вопрос:

У меня есть ссылка, в которой указан номер счета, поэтому, как только я нажимаю на нее, она должна предоставлять данные определенного номера счета без перезагрузки страницы.[код]

Ответ №1:

используйте компоненты, предоставляемые пакетом ‘react-router-dom’, вместо тега привязки ‘a’ используйте компоненты ‘Link’ или ‘NavLink’ пример : от this => <a href='#'>my-link></a> до this => <Link to='#'>my-link></Link>

для получения дополнительной информации ознакомьтесь с официальной документацией https://reactrouter.com/docs/en/v6/examples/basic

Ответ №2:

Маршрутизация обычно обрабатывается браузером, который отправляет HTTP-запросы при изменении URL.
Здесь кажется, что вы хотите, чтобы ваше приложение обрабатывало изменения URL, чтобы оно отображало содержимое в зависимости от URL. Это называется маршрутизацией на стороне клиента, вы можете сделать это с помощью:

Ответ №3:

Вы могли бы предотвратить перезагрузку страницы, используя preventDefault метод в практике событий.

 function onLinkClick(e) {
   e.preventDefault();
   // further processing happens here
}

<a href="/my-invoice-link" onClick={onLinkClick} />
  

Ответ №4:

Простой способ перенаправить другую страницу без обновления страницы…

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

addpost — это имя маршрута

<ul>
<li><Link to="/addpost">AddPost</Link> </li>
</ul>