首頁猿問使用...

使用 react-router-dom 重定向 onclick 事件

JavaScript

喵喵時光機 2022-01-20 18:57:49

我想使用router-react-dom. 我創建了一個這樣的函數：const {id} = props; const redirect = () => { console.log("redirecting..."); const url = `/${id}`; return <Redirect to={url} />; };然后我像這樣為其他組件制作道具： <BtnDetalii clickFn={redirect} text="apasa aici pentru mai multe detalii" />這是我的 btnDetalii 組件const BtnDetalii = props => ( <div onClick={() => props.clickFn()} className="detalii"> {props.text} </div>);當我點擊按鈕不起作用。我錯過了什么？

查看完整描述

2 回答

汪汪一只貓

TA貢獻1898條經驗獲得超8個贊

你可以使用 React Router v4。withRouter用from包裹你的組件，react-router-dom這樣你就可以訪問historyprop. 之后，您可以為您的道具push添加新網址。history

我不確定您的redirect函數所在的父組件中的代碼是什么，但這是一個使用withRouter. 如果您共享更多組件，我可以更改代碼段并添加您的代碼。

import React from "react";

import { withRouter } from "react-router-dom";

import BtnDetalii from "./BtnDetalii";

const Card = withRouter(({ history, ...props }) => {

const redirect = () => {

console.log("redirecting...");

const id = props.id;

const url = `detalii/${id}`;

history.push(url);

};

return (

<div className="data">{props.nume}</div>

<p className="text">{props.strada}</p>

<BtnDetalii

clickFn={redirect}

text="apasa aici pentru mai multe detalii"

</div>

);

});

export default Card;

反對回復 2022-01-20

莫回無

TA貢獻1865條經驗獲得超7個贊

檢查此示例以獲取功能組件，您可以閱讀文檔以更好地理解。

import { useHistory } from "react-router-dom";

function HomeButton() {

let history = useHistory();

function handleClick() {

history.push("/home");

}

return (

Go home

</button>

);

}

反對回復 2022-01-20

2 回答
0 關注
312 瀏覽

關注

添加回答

舉報

0/150

提交

取消

亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

熱搜

最近搜索清空

使用 react-router-dom 重定向 onclick 事件

使用 react-router-dom 重定向 onclick 事件

2 回答

添加回答