美好的一天，我在使用最新的 react-router-dom v6 時遇到問題，我還在學習新版本。請幫忙。
import React from 'react'
function Bookingscrren({match}) {
return (
<div>
<h1>Booking Page</h1>
<h1>Room id = {match.useParams.roomid}</h1>
</div>
)
}
export default Bookingscrren瀏覽器輸出錯誤：
請善待:)我是新來的
uj5u.com熱心網友回復：
這不是正確的使用方式useParams。use所有這些以或 react 鉤子開頭的函式都只是那些函式。這意味著您打電話給他們以訪問他們的功能。
import React from 'react'
function Bookingscrren() {
const params = useParams();
return (
<div>
<h1>Booking Page</h1>
<h1>Room id = {params.roomid}</h1>
</div>
)
}
useParams 的回傳值是一個帶引數的物件。您可以通過操作員訪問每一個.。
uj5u.com熱心網友回復：
歡迎來到本站！利用 ”？” 在物件內部導航時運算子。我在此處粘貼檔案鏈接（鏈運算子）快速示例：a?.b?.c
無論如何列印“匹配”內容，看看里面是否有 useParams 屬性。
如果你想像這樣使用 router-dom useParams：
import {
...
useParams
} from "react-router-dom";
let { id } = useParams(); //This is the hookuj5u.com熱心網友回復：
通過閱讀名稱，useParams你可以掌握這個概念，即你面臨一個hook。所以useParams用來獲取路由引數。例子：
function Bookingscreen() {
const {id} = useParams()
return (
<div>
<h1>Booking Page</h1>
<h1>Room ID = {id}</h1>
</div>
)
}
轉載請註明出處，本文鏈接：https://www.uj5u.com/qukuanlian/503696.html
標籤：javascript 节点.js 反应 dom 反应钩子
下一篇：如何呼叫在Reducer內部呼叫的Function，并且所述Function使用useReducer回傳的State？