020fd0d85a
- basic-jsx: Counter + Clock with defineComponent() + JSX - basic-template: Counter + Clock with .vue SFC + <template> - Both demonstrate HMR via vue-tui dev - Fix vite-plugin: strip build.lib and external config for bundledDev, add node builtins resolveId to prevent browser-external shimming - Remove old hmr-demo example (superseded by basic-template) Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
27 lines
548 B
Vue
27 lines
548 B
Vue
<script lang="ts">
|
|
import { shallowRef, defineComponent } from "vue";
|
|
import { Box, Text, useInput } from "@vue-tui/runtime";
|
|
|
|
export default defineComponent({
|
|
components: { Box, Text },
|
|
setup() {
|
|
const count = shallowRef(0);
|
|
|
|
useInput((input) => {
|
|
if (input === "+") count.value++;
|
|
if (input === "-") count.value--;
|
|
});
|
|
|
|
return { count };
|
|
},
|
|
});
|
|
</script>
|
|
|
|
<template>
|
|
<Box>
|
|
<Text>Count: </Text>
|
|
<Text bold color="green">{{ count }}</Text>
|
|
<Text dimColor> (+/- to change)</Text>
|
|
</Box>
|
|
</template>
|