相关疑难解决方法(0)

绑定元素“组件”隐式具有“任何”type.ts

新手来了 我对以下代码有问题。我想定义一个受保护的“仪表板”页面,如下所示,但给了我这个绑定错误:

Binding element 'Component' implicitly has an 'any' type.ts(7031)


import * as React from "react";
import { Route, Router, Redirect } from "react-router-dom";
import Dashboard from "../features/dashboard";
import LoginContainer from "../features/login/containers/LoginContainer";
import SignUpContainer from "../features/signup/containers/SignUpContainer";
import { createBrowserHistory } from "history";

const history = createBrowserHistory();

export default () => (
  <Router history={history}>
    <Route path="/" component={LoginContainer} />
    <Route path="/login" component={LoginContainer} />
    <Route path="/register" component={SignUpContainer} />

    <PrivateRoute path="/dashboard" component={Dashboard} />
  </Router>
);

function PrivateRoute({ component: Component, ...rest }) {
  return ( …
Run Code Online (Sandbox Code Playgroud)

typescript reactjs react-router-dom

8
推荐指数
1
解决办法
8900
查看次数

使用 react-router-dom 成功认证后将用户重定向到他们请求的页面

我已经构建了一个公共路由组件,用于登录以在用户未通过身份验证时显示。每当未登录的用户单击受保护的路由时,他将被重定向到登录页面,他可以在其中输入凭据。我想要一种编程方式,以便如果他使用正确的凭据登录,他应该被重定向到他首先尝试访问的页面。例如,如果用户请求个人资料页面,他应该在登录后重定向到该页面,如果用户请求设置页面,也会发生同样的情况。

截至目前,我只能将它们重定向到 home path /。有什么方法可以使用重定向,以便它知道用户请求的路径?

这是我当前的公共路由组件代码

export const PublicRoute = ({
    isAuthenticated,
    component: Component,
    ...rest
}: PublicRouteProps) => (
    <Route
        {...rest}
        component={(props: any) => {
            console.log(props.path);
            return isAuthenticated.auth ? (
                <Redirect to='/' />
            ) : (
                <div>
                    <Component {...props} />
                </div>
            );
        }}
    />
);
const mapStateToProps = (state: ReduxStoreState) => ({
    isAuthenticated: state.isAuthenticated
});

export default connect(mapStateToProps)(PublicRoute);

Run Code Online (Sandbox Code Playgroud)

redirect typescript reactjs react-router react-router-dom

5
推荐指数
1
解决办法
5689
查看次数