A través de <Route>
, dirijo a distintos componentes. En uno de ellos necesito pasar un parámetro, y lo hago de esta forma:
const AppRoutes = () =>
<Switch>
<Route path='/:slug' component={Articulo} />
<Route exact path='/' component={App} />
<Route component={Page404} />
</Switch>
export default AppRoutes;
El componente <articulo>
lo he creado en un fichero aparte, pero algo estoy haciendo mal y no sé el qué. El fichero lo tengo así:
import React, { Component } from 'react';
class Articulo extends Component {
render() {
return (<h2>Este es el slug del artículo: {match.params.slug}</h2>)
}
}
export default Articulo;
Sin embargo, me devuelve un error:
'match' is not defined no-undef
Todos la documentación que he encontrado crear el componente en el mismo fichero de esta forma:
const Articulo = () => (
<h1>Este es el slug: {match.params.slug}</h1>
)
De esta forma no habría problema, pero necesito hacerlo en un componente separado.
this
. En versiones futuras de ECMAScript no será necesario.