diff --git a/packages/hooks/index.ts b/packages/hooks/index.ts index 82371fd..6824eb4 100644 --- a/packages/hooks/index.ts +++ b/packages/hooks/index.ts @@ -1,3 +1,3 @@ import useDocumentTitle from "./src/useDocumentTitle"; - -export { useDocumentTitle }; +import useSafeNavigate from "./src/useSafeNavigate"; +export { useDocumentTitle, useSafeNavigate }; diff --git a/packages/hooks/src/useSafeNavigate.ts b/packages/hooks/src/useSafeNavigate.ts new file mode 100644 index 0000000..b38e576 --- /dev/null +++ b/packages/hooks/src/useSafeNavigate.ts @@ -0,0 +1,23 @@ +// hooks/useSafeNavigate.ts +import { useNavigate, NavigateOptions } from "react-router-dom"; + +const useSafeNavigate = () => { + const navigate = useNavigate(); + + return (path: string, options: NavigateOptions = {}) => { + const isBaidu = /baiduboxapp|baidubrowser|baidu/i.test(navigator.userAgent.toLowerCase()); + + if (isBaidu) { + const fullPath = path.startsWith("http") ? path : window.location.origin + path; + + if (options.replace) { + window.location.replace(fullPath); + } else { + window.location.href = fullPath; + } + } else { + navigate(path, options); + } + }; +}; +export default useSafeNavigate; diff --git a/projects/translate-h5/src/route/render-routes.tsx b/projects/translate-h5/src/route/render-routes.tsx index d0071a5..1505a2a 100644 --- a/projects/translate-h5/src/route/render-routes.tsx +++ b/projects/translate-h5/src/route/render-routes.tsx @@ -1,4 +1,4 @@ -import { Route, Routes } from "react-router-dom"; +import { Route, RouterProvider, Routes } from "react-router-dom"; import { routes, AppRoute } from "./routes"; import AuthRoute from "./auth.tsx"; import { Suspense } from "react"; @@ -35,7 +35,7 @@ export const RenderRoutes = () => { display: "flex", alignItems: "center", justifyContent: "center", - fontSize: "12px", + fontSize: "24px", }} > diff --git a/projects/translate-h5/src/route/routes.tsx b/projects/translate-h5/src/route/routes.tsx index 91abe1c..68e169e 100644 --- a/projects/translate-h5/src/route/routes.tsx +++ b/projects/translate-h5/src/route/routes.tsx @@ -1,5 +1,6 @@ -import { Navigate } from "react-router-dom"; +import { createBrowserRouter, Navigate } from "react-router-dom"; import { lazy } from "react"; +import { type Router } from "react-router-dom"; export interface AppRoute { path: string; diff --git a/projects/translate-h5/src/view/home/index.tsx b/projects/translate-h5/src/view/home/index.tsx index 1988f22..2bccfb3 100644 --- a/projects/translate-h5/src/view/home/index.tsx +++ b/projects/translate-h5/src/view/home/index.tsx @@ -1,16 +1,26 @@ import MainLayout from "@/layout/main/mainLayout"; -import { useState } from "react"; +import { useEffect, useState } from "react"; import { Divider, Space } from "antd-mobile"; import Translate from "./translate/index"; -import { Electrocardiogram, Filter, GithubOne } from "@icon-park/react"; +import { Electrocardiogram, Filter, GithubOne, HamburgerButton } from "@icon-park/react"; import { useNavigate } from "react-router-dom"; +import { useSafeNavigate } from "@workspace/hooks"; import "./index.less"; function Index() { const [visible, setVisible] = useState(false); + const safeNavigate = useSafeNavigate(); const navigate = useNavigate(); + useEffect(() => { + if (window.history) { + // // 往历史记录里面添加一条新的当前页面的url + // // 给 popstate 绑定一个方法监听页面返回 + window.addEventListener("popstate", () => onLink(""), false); //false阻止默认事件 + } + }, []); const onLink = (link: string) => { + // safeNavigate(link); navigate(link); }; return ( @@ -35,6 +45,13 @@ function Index() { strokeLinecap="butt" onClick={() => onLink("/translate/archives")} /> + diff --git a/projects/translate-h5/tsconfig.json b/projects/translate-h5/tsconfig.json index 87741a3..8e5fcb9 100644 --- a/projects/translate-h5/tsconfig.json +++ b/projects/translate-h5/tsconfig.json @@ -25,5 +25,10 @@ "@hooks/*": ["packages/hooks/src/*"] } }, - "include": ["src", "../../packages/shared/src", "../../packages/utils/src"] + "include": [ + "src", + "../../packages/shared/src", + "../../packages/utils/src", + "../../packages/hooks/src/useSafeNavigate.ts" + ] }