Vue.js: How to type ref in Vue 3 with TypeScript?

1import { ref } from "vue"
2
3// Basic types
4const count = ref<number>(0)
5const name = ref<string>("John")
6const isActive = ref<boolean>(true)
7
8// Complex types
9interface User {
10    id: number
11    name: string
12}
13
14const user = ref<User>({ id: 1, name: "John" })
15const users = ref<User[]>([])
16
17// Nullable
18const selected = ref<User | null>(null)
19
20// Generic
21const state = ref<{ count: number; items: string[] }>({
22    count: 0,
23    items: []
24})