0

MENSAJE DE ERROR Type '{ location: Location; }' is not assignable to type 'IntrinsicAttributes & IntrinsicClassAttributes<Component<Pick<RouteComponentProps<{}, StaticContext, UnknownFacade>, never>, any, any>> & Readonly<...> & Readonly<...>'. Property 'location' does not exist on type 'IntrinsicAttributes & IntrinsicClassAttributes<Component<Pick<RouteComponentProps<{}, StaticContext, UnknownFacade>, never>, any, any>> & Readonly<...> & Readonly<...>'.

Type '{ location: Location<UnknownFacade>; }' is not assignable to type 'IntrinsicAttributes & IntrinsicClassAttributes<Component<Pick<RouteComponentProps<{}, StaticContext, UnknownFacade>, never>, any, any>> & Readonly<...> & Readonly<...>'.
  Property 'location' does not exist on type 'IntrinsicAttributes & IntrinsicClassAttributes<Component<Pick<RouteComponentProps<{}, StaticContext, UnknownFacade>, never>, any, any>> & Readonly<...> & Readonly<...>'.  TS2322

     8 |     <Router>
     9 |         <Switch>
  > 10 |             <Route exact path='/' render={({location}) => <Visited location={location} />}/>
       |                                                                    ^
    11 |             <Route path='/admin' component={Admin} />
    12 |         </Switch>
    13 |     </Router>

COMPORTAMIENTO ESPERADO Que me compile sin tener que poner el tipo "any" a location

App.tsx

import React from 'react';
import {HashRouter as Router, Route ,Switch} from 'react-router-dom';
import Visited from '../modules/visited';
import Admin from '../modules/admin';


const App: React.FC = () => (
    <Router>
        <Switch>
            <Route exact path='/' render={({location}) => <Visited location={location} />}/>
            <Route path='/admin' component={Admin} />            
        </Switch>
    </Router>
)

export default App;

Visited.tsx

import React  from 'react';
import { Switch, Route, RouteComponentProps, withRouter } from 'react-router-dom';
import Home from './containers/home';


const Visited: React.FC<RouteComponentProps> = ({location}) => {
    return (
        <Switch location={location} key={location.pathname}>
            <Route exact path="/" component={Home} />
        </Switch>
    )
}

export default withRouter(Visited);
2
  • De donde viene location en tu componente App? Commented el 23 ago. 2020 a las 4:00
  • en el metodo render de un Route en react-router te vienen las props y una de esas props es ese location que solamente lo estoy destructurando en mi componente App y que ese mismo estoy queriendo pasar al componente Visited - tal vez formule mal la pregunta - seria algo asi Que tipo(typescript) recibe el Location ya que si lo pongo como any - todo me funciona bien Commented el 23 ago. 2020 a las 15:56

1 respuesta 1

0

SOLUCION - RESUELTA

react-router tenia problemas con el RouteComponentsProps al usar typescript, por eso opte por usar la libreria de @reach/router - y con este me funciono perfectamente.!

App.tsx

App.tsx

Visited.tsx

Visited.tsx

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.