我正在做一個個人React.js專案。我想從我正在使用的 API 動態執行導航欄。我想顯示電影串列的鏈接。問題是API帶來了一個物件,代碼不知道怎么做。這是代碼:
import { useState } from "react";
import { BrowserRouter, Link } from "react-router-dom";
const Navbar = () => {
const [result, setResult] = useState([]);
const fetchData = async () => {
const res = await fetch("https://www.swapi.tech/api/films/");
const json = await res.json();
setResult(json.result);
}
useEffect(() => {
fetchData();
}, []);
return (
<>
<BrowserRouter>
{result.map((value, key) => {
<Link />
})}
</BrowserRouter>
</>
);
}
export default Navbar;
也許除了動態之外還有另一種方法可以做到這一點。此外,我還有另一個帶有電影渲染串列的組件。理想情況下,我希望能夠單擊該串列中的每個專案,然后轉到帶有其說明的新頁面。導航欄的鏈接將轉到相同的頁面。提前致謝!
uj5u.com熱心網友回復:
試試這個方法來處理你的 API 回應
<BrowserRouter>
{result.map((value) => (
<Link to={value._id}>{value.description}</Link>
))}
</BrowserRouter>
轉載請註明出處,本文鏈接:https://www.uj5u.com/houduan/386055.html
