nested route updates

[TreetopFlyer]

Enjoying WMR, I had a question about nested routes. I'm probably not understanding something about router setup/route changes but here goes:

If you:

1. create the WMR starter project (npm init wmr)
2. modify the "about" route path (in public/index.js) from path="/about" to path="/about:tab*"
3. modify the about page (public/pages/about/index.js) to include a nested route and counter component like such:

import styles from './style.module.css';
import { Router } from 'preact-iso';
import { useState } from 'preact/hooks';

const Counter = () =>
{
	let [countGet, countSet] = useState(0);
	return <button onClick={e=>{countSet(countGet+1)}}>{countGet}</button>;
};
const About = ({ query }) => (
	<section class={styles.about}>
		<h1>About</h1>
		<p>A page all about this website.</p>
		<pre>{JSON.stringify(query)}</pre>
		
		<p>count: <Counter/> will reset count: <a href="/about/tab1">One</a> | <a href="/about/tab2">Two</a></p>
		<Router>
			<div path="/about/tab1"><h2>Tab One</h2></div>
			<div path="/about/tab2"><h2>Tab Two</h2></div>
		</Router>

	</section>
);
export default About;

4. run the dev server and go to /about
5. if you increment the counter, and then change tabs (which works correctly), the count state will reset.

[developit]

Yeah, this one is tricky, and currently it's "working as designed". We need to fully replace routes when navigating in order to allow for the routes to potentially suspend - and we can't really know in advance whether they will or won't do so.

IIRC most of the other routers work this way, preact-router was sortof on its own. I don't know what the right answer is though, ideally we would provide a way to configure if you want shared routes to remount or simply update.

[TreetopFlyer]

@developit thank you much, makes sense!