#reactjs #react-router
#reactjs #реагировать-маршрутизатор
Вопрос:
Я хочу, чтобы, когда я нажимаю на кнопку, она перенаправляла меня на страницу оплаты.
import React,{useHistory, useState} from 'react'
import data from './data.json'
function GLC() {
let history = useHistory();
function handleClick() {
history.push("/payment");
}
return (
<div >
{data.map((postData) =>{
console.log(postData)
return(
<div key=
{postData.id}>
<div className='absolute '>
<img className='w-screen object-contain'src="./ModImages/Gclass.jpg"></img>
<h1 className='absolute ml-24 md:text-5xl sm:text-5xl top-8'>Class G</h1>
<h1 className='absolute text-base font-mono ml-24 top-24'>$43,600</h1>
<button onClick={handleClick} className=' absolute text-black-600 h-10 top-24 ml-24 mt-32 bg-
white w-36 rounded-full focus:outline-none focus:ring-2 focus:ring-gray-600'>BuyNow</button>
</div>
</div>
)
})
}
</div>
)
}
export default GLC
Комментарии:
1. А что происходит с вашим текущим кодом?
2. @jonrsharpe когда я нажимаю на компонент GLC, я получаю эту ошибку типа: Объект (…) не является функцией
3.
useHistory
необходимо импортировать из react-router, а не реагировать. Ie:import { useHistory } from 'react-router'
4. Я слепой, спасибо, чувак
5. @Николас Тауэр Могу я спросить тебя кое о чем
Ответ №1:
// Make sure you alreadly installed the react-router-dom package.
import { useHistory } from 'react-router-dom';
function GLC() {
const history = useHistory();
function handleClick() {
history.push("/payment");
}
// ...
}
Тогда вы можете работать .