#reactjs #redirect #button
Вопрос:
можем ли мы использовать <a>
тег в reactjs для перенаправления на страницу
В настоящее время, я использовал его для ссылки, и по какой-то причине он не работает
кроме того, я использовал Link
Route
useHistory
для переориентации, и даже они не работают
Я добавил один button
из них в таблицу, и я хочу, чтобы redirect
он отображался на новой странице при нажатии
с useHistory
помощью я импортировал это в свой файл js
import { useHistory } from "react-router-dom";
Я использовал это в своей export function
let history = useHistory();
function handleClick() {
history.push("/bookingSlot");
}
используется handleClick()
в button
<button type="button" onClick={handleClick}>
Click Me!
</button>
Фрагмент кода
import React from 'react';
import '../scss/components/table';
import data from '../../public/userData';
import { useHistory } from "react-router-dom";
export default function ReservedListView() {
console.log('data :' JSON.stringify(data));
let header = Object.keys(data[0]);
console.log('header :' header);
let history = useHistory();
function handleClick() {
history.push("/bookingSlot");
}
return (
<div>
<table id="students" class="table">
<tbody>
<tr>
<th>Name</th>
<th>Date</th>
<th>Day</th>
<th>SimeSlot</th>
</tr>
{data.map((el, index) => (
<tr>
<td>{el.name}</td>
<td>{el.date}</td>
<td>{el.day}</td>
<td>{el.timeSlot}</td>
</tr>
))}
<tr>
<td colSpan="4">
{/* buttons with usehistory()*/}
<button type="button" onClick={handleClick}>
Click Me Button!
</button>
{/* button with <a> tag */}
<a href="/bookingSlot.js">Click Me!</a>
</td>
</tr>
</tbody>
</table>
</div>
);
}
когда я click
на first button
Я получаю эту ошибку
дайте мне знать, если я делаю это неправильно
Ответ №1:
В соответствии с вашим текущим кодом все должно работать нормально, проверьте этот код, это может помочь.
Комментарии:
1. Спасибо! для этого взгляну и выясню фактическую проблему с моим кодом