Newbie here. I have problems with the following code. I want to define a protected "Dashboard" page, as follows, but is giving me this binding error:
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 (
<Route
{...rest}
render={props =>
localStorage.getItem("MyStoredUser") ? (
<Component {...props} />
) : (
<Redirect
to={{
pathname: "/login"
}}
/>
)
}
/>
);
}
Basically I am using the same code as it is here:Protected routes and authentication with React Router v4 and eact Router - Redirects
What am I doing wrong?