sandbox/solid-repro/src/index.tsx

48 lines
974 B
TypeScript
Raw Normal View History

2022-11-25 13:28:11 +00:00
/* @refresh reload */
import { render } from 'solid-js/web';
2022-11-25 14:55:03 +00:00
import { Component, createEffect, createSignal, onMount } from 'solid-js';
2022-11-25 13:28:11 +00:00
import {
Router,
Routes,
Route,
Navigate,
useParams,
useNavigate,
hashIntegration,
2022-11-25 14:55:03 +00:00
useRouteData,
2022-11-25 13:28:11 +00:00
} from '@solidjs/router';
const Counter: Component = () => {
const params = useParams();
2022-11-25 14:55:03 +00:00
const [count, setCount] = createSignal(0);
createEffect(() => {
setCount(+params.count);
});
2022-11-25 13:28:11 +00:00
const navigate = useNavigate();
return (
<>
2022-11-25 14:55:03 +00:00
<button onClick={() => navigate(`/counter/${count() + 1}`)}>+1</button>
2022-11-25 13:28:11 +00:00
<div>Count: {count}</div>
</>
);
};
const App: Component = () => {
return (
<Routes>
<Route path='/counter/:count' component={Counter} />
<Route path='/*' element={<Navigate href='/counter/0' />} />
</Routes>
);
};
2022-11-25 14:55:03 +00:00
// source={hashIntegration()}
2022-11-25 13:28:11 +00:00
render(
() => (
2022-11-25 14:55:03 +00:00
<Router >
2022-11-25 13:28:11 +00:00
<App />
</Router>
),
document.getElementById('root') as HTMLElement
);