Yönlendirme ve Gezinme

Carats'ta yönlendirme bir dosya sistemi değil, veridir. Her rota, istemci ile sunucunun paylaştığı tek bir facet nesnesinde bildirilir.

Rotalar

Rotalar haritası bir rota kalıbından sayfa bileşenine gider. Kalıp, iki nokta ile başlayan segmentler dışında birebir eşleştirilir; bu segmentler bir parametre yakalar.

// src/client/facets.cara.ts
import { defineFacets } from '@carats/render';
import ErrorPage from './pages/_error';
import NotFound from './pages/_not_found';
import Home from './pages/home';
import Market from './pages/market';
import Profile from './pages/profile';
import Trade from './pages/trade';

export default defineFacets({
    routes: {
        '/': Home,
        '/profile': Profile,
        '/market': Market,
        '/trade/:symbol': Trade
    },
    suspense: {
        error: ErrorPage,
        notFound: NotFound
    },
    inAppRouting: true
});

Sayfa klasörü adı bir gelenek, bir gereklilik değildir. Klasör ilgili dosyaları bir arada tutar; ancak bir klasörün sunduğu rota, onun eşlendiği dizedir; bu yüzden `/market`, adı daha iyi okunuyorsa `browse` adlı bir klasörde yaşayabilir.

Dinamik Parametreler

Bir :name segmenti, sayfa bileşeninde bir prop olur ve aynı rota için bir culet'in içinde params.name olarak da kullanılabilir. İki tarafta ad eşleşmelidir.

// src/client/pages/trade/index.tsx
import { Burnish } from '@carats/render';
import Layout from '../_layout';
import './trade.sass';

export default Burnish<TradeData>(function (data) {
    this.head = <title>Trade {data.symbol}</title>;
    return (
        <Layout>
            <h1>{data.symbol}</h1>
        </Layout>
    );
});

`/trade/btc`, bu sayfayı aynı rota için kayıtlı culet'ten çözülen `data.symbol` ile işler ve sayfa her sembol için farklı bir `