useCounterの中身。injectしてるからVueインスタンス経由でアクセスしないといけない。アプリケーションコードは上流でprovide()してコンポーネント間で状態管理する #CodePiece

CodePiece.js

import { ref, inject, Ref } from 'vue';
export const CounterKey = Symbol()
export type Counter = {
  count: Ref
  increment(): void
}
export function useCounter(initialValue: number): Counter {
  const count = inject(CounterKey, ref(initialValue));
  return {
    count,
    increment(): void {
      count.value +=1;
    },
  }
}