Repository navigation
Change base does not work #64
Description
function App() {
const [base, setBase] = createSignal('old');
return <Router base={base()}>
<button onclick={() => setBase('new')}>Change base</button>
<Link href="/about">about</Link>
<Routes />
</Router>
}After change base to new then call useNavigator()('/about') still navigate to /old/about
Activity
rturnq commentedon Jan 3, 2022
The
baseprop on theRoutercomponent is not intended to be changed during the lifetime of the component. It's primary purpose is to provide a convenient way configure applications that are hosted at some path other than the root.My biggest question for supporting a dynamic router
baseis what is the expectation of the matched routes when you change the base? For instance if the browsers is at/old/aboutand you change the base fromoldtonew, no routes will match until you navigate to/new/about. Should the router navigate there automatically? Is there a common use-case here I'm not seeing?iamcco commentedon Jan 6, 2022
My use case is that our website use the base as the i18n location. For example base
en-usand athttps:/example.com/en-us/aboutpage, after user change their language tozh-cnthen updatebasetozh-cnand callnavigator('/about')to/zh-cn/about.My workaround now is refresh the page using the
window.location.href.ryansolid commentedon Jan 21, 2022
The workaround is pretty reasonable. Since the base is outside of the routers dynamic path matching it would be interesting to decide what the behavior should be. I'd lean towards routing to that given we don't want to be in an inconsistent state with the browser.. but it also doesn't really work both ways.. like if you press browser back we can't restore the language setting. I don't know if the router can take responsibility for the base in this sense.