react-router-dom v6在非jsx上下文中的重定向

Question

我正试图将用户从他们当前正在查看的路由重定向到另一条路由。在我的例子中，我是而不是在JSX环境中，不能使用任何类型的React钩子。我该怎么做呢?

我尝试使用下面的代码块来重定向(尝试使用JSX)，只是意识到它不会工作，因为它不在根路由器的上下文中。

ReactDOM.render(<div>
<Navigate to="/" />
</div>, document.getElementById("redirect"));

我还想尝试重定向而不使用window.location.href =，因为这会导致整个页面刷新，这是我不希望发生的事情。

编辑:根据要求，我正试图从一个事件重定向到一个页面，该事件由金牛头发出，并由前端的一些TypeScript代码处理。使用window.location.href在任何情况下都不是问题。

下面是我要做的一个例子:

/**
* Sets up event listeners.
*/
export async function setupListeners() {
console.log("Setting up link event listeners...");
await listen("deeplink", onLinked);
}

/**
* Invoked when a deep link call is received.
* @param event The event.
*/
async function onLinked(event: Event<string>) {
const { payload } = event;
if (payload == "test:")
// redirect("/testPage");
}

Answer 1

参见redirect:

import { redirect } from "react-router-dom";
const loader = async () => {
const user = await getUser();
if (!user) {
return redirect("/login");
}
};

(来自文档)