Considera quanto segue:
var AppRoutes = [
<Route handler={App} someProp="defaultProp">
<Route path="/" handler={Page} />
</Route>,
<Route handler={App} someProp="defaultProp">
<Route path="/" handler={Header} >
<Route path="/withheader" handler={Page} />
</Route>
</Route>,
<Route handler={App} someProp="defaultProp">
<Route path=":area" handler={Area} />
<Route path=":area/:city" handler={Area} />
<Route path=":area/:city/:locale" handler={Area} />
<Route path=":area/:city/:locale/:type" handler={Area} />
</Route>
];
Ho un modello di app, un HeaderTemplate e un set di percorsi parametrizzato con lo stesso gestore (all'interno del modello di app). Voglio essere in grado di servire 404 rotte quando qualcosa non viene trovato. Ad esempio, / CA / SanFrancisco dovrebbe essere trovato e gestito da Area, mentre / SanFranciscoz dovrebbe essere 404.
Ecco come testare rapidamente i percorsi.
['', '/', '/withheader', '/SanFranciscoz', '/ca', '/CA', '/CA/SanFrancisco', '/CA/SanFrancisco/LowerHaight', '/CA/SanFrancisco/LowerHaight/condo'].forEach(function(path){
Router.run(AppRoutes, path, function(Handler, state){
var output = React.renderToString(<Handler/>);
console.log(output, '\n');
});
});
Il problema è che / SanFranciscoz viene sempre gestito dalla pagina Area, ma voglio che sia 404. Inoltre, se aggiungo NotFoundRoute alla prima configurazione di route, tutte le pagine di Area 404.
<Route handler={App} someProp="defaultProp">
<Route path="/" handler={Page} />
<NotFoundRoute handler={NotFound} />
</Route>,
Che cosa sto facendo di sbagliato?
Ecco una sintesi che può essere scaricata e sperimentata.