diff options
Diffstat (limited to 'examples/framework-preact/src')
| -rw-r--r-- | examples/framework-preact/src/components/Counter.tsx | 8 | ||||
| -rw-r--r-- | examples/framework-preact/src/pages/index.astro | 12 |
2 files changed, 7 insertions, 13 deletions
diff --git a/examples/framework-preact/src/components/Counter.tsx b/examples/framework-preact/src/components/Counter.tsx index 5d702fb42..61a9f9d5a 100644 --- a/examples/framework-preact/src/components/Counter.tsx +++ b/examples/framework-preact/src/components/Counter.tsx @@ -1,9 +1,11 @@ import { h, Fragment } from 'preact'; +import { useState } from 'preact/hooks'; import './Counter.css'; -export default function Counter({ children, count }) { - const add = () => count.value++; - const subtract = () => count.value--; +export default function Counter({ children }) { + const [count, setCount] = useState(0); + const add = () => setCount((i) => i + 1); + const subtract = () => setCount((i) => i - 1); return ( <> diff --git a/examples/framework-preact/src/pages/index.astro b/examples/framework-preact/src/pages/index.astro index b37295d7b..a6565f6c1 100644 --- a/examples/framework-preact/src/pages/index.astro +++ b/examples/framework-preact/src/pages/index.astro @@ -2,12 +2,8 @@ // Component Imports import Counter from '../components/Counter'; -import { signal } from '@preact/signals'; - // Full Astro Component Syntax: // https://docs.astro.build/core-concepts/astro-components/ - -const count = signal(0); --- <html lang="en"> @@ -29,12 +25,8 @@ const count = signal(0); </head> <body> <main> - <Counter count={count} client:visible> - <h1>Hello, Preact 1!</h1> - </Counter> - - <Counter count={count} client:visible> - <h1>Hello, Preact 2!</h1> + <Counter client:visible> + <h1>Hello, Preact!</h1> </Counter> </main> </body> |