Блог

Я установил react-маршрутизатор-domV6-бета.

Следуя примеру с веб-сайта, я могу использовать новую опцию «Маршруты пользователей», у меня есть маршруты страниц настройки, и я возвращаю их в App.js файл.

После сохранения я получаю следующую ошибку:

Ошибка: Ошибка: Функция useLocation() может использоваться только в контексте компонента.

App.js

 import "./App.css"; import react, { useState, useEffect } from "react"; import { BrowserRouter as Router, Route, Routes } from "react-router-dom"; import _ from "lodash"; import Cast from "./Cast"; import list from "./list"; import Footer from "./Footer"; import DetailLayout from "./DetailLayout";  function App() {  const [charnames, setCharnam] = useState("");   function charname(names) {  setCharnam(names);  }   function castDetail(everycast) {  return (  lt;Cast  key={everycast.id}  url={everycast.url}  name={everycast.name}  castp={charname}  /gt;  );  }  const cc = charnames;  const p = "/"   cc;  //const p="/haha h";  const res = p.replace(/ /g, "");   return (  lt;div className="App"gt;  lt;div className="overview"gt;{list.map(castDetail)}lt;/divgt;  {/* lt;DetailLayout /gt; */}  {console.log(charnames)}  lt;Routergt;  lt;Cast /gt;  lt;Routesgt;  lt;Route exact path={res} element={lt;DetailLayout /gt;} /gt;  lt;/Routesgt;  lt;/Routergt;   lt;Footer /gt;  lt;/divgt;  ); } export default App;   

Cast.js

 import react from "react"; import { NavLink } from "react-router-dom"; export default function Cast(props) {  function setpath() {  props.castp(props.name);  }  const path = "/"   props.name;   return (  lt;div className="cast"gt;  {/* lt;Link to="/about"gt;Aboutlt;/Linkgt; */}  {/* lt;NavLink to="/about"gt;Aboutlt;/NavLinkgt; */}  lt;NavLink to={path}gt;  lt;img onClick={setpath} src={props.url} /gt;{" "}  lt;/NavLinkgt;  lt;pgt;{props.name}lt;/pgt;  lt;/divgt;  ); }