eno/example/deep/component.tsx

23 lines
919 B
TypeScript
Raw Normal View History

import React from "react";
2023-04-05 23:34:20 -04:00
import * as Iso from "@eno/iso";
export default ()=>
{
const [countGet, countSet] = React.useState(1);
2023-04-13 22:23:04 -04:00
const [routeGet, routeSet] = Iso.Router.Consumer();
2023-04-19 20:56:30 -04:00
type CatFact = {fact:string, length:number}|undefined;
2023-04-22 13:48:32 -04:00
const [Data, Updating] = Iso.Fetch.Use(`https://catfact.ninja/fact`);
2023-04-22 12:08:58 -04:00
2023-04-25 20:41:22 -04:00
console.log("component.tsx render!!")
2023-04-19 20:56:30 -04:00
return <div class="p-4 text-red-500">
2023-05-14 07:26:18 -04:00
<Iso.Meta.Metas title="Component!" description="components can set metas"/>
2023-04-22 12:08:58 -04:00
Component Route is: {routeGet.Path.toString()}
2023-04-22 13:48:32 -04:00
<button className="p-4 bg-green-500 text-white" onClick={e=>{countSet(countGet+1); routeSet(["lol", "idk"], {count:countGet+1});}}>{countGet}</button>
2023-04-15 12:39:08 -04:00
<a href="/page/about-us" className="p-2 text(lg blue-500) font-bold">a link</a>
2023-04-19 20:56:30 -04:00
<p>Data:{Data && (Data as CatFact)?.fact}</p>
<p>Status:{Updating?'loading':'done'}</p>
</div>;
};