#vue
https://v3.vuejs.org/guide/reactivity-computed-watchers.html#watching-a-single-source
https://v3.vuejs.org/guide/reactivity-computed-watchers.html#watching-multiple-sources
## TypeScript
`watch`を使う。
```ts
import {
defineComponent,
watch,
} from "@vue/composition-api";
export default defineComponent({
setup() {
const state = reactive({
inputValue: "0" as string | undefined,
a: "hoge",
b: "huga"
});
// - 特定の値に変更があったときに処理を行う場合はwatchを使う
// - 算出プロパティで実現できる場合はcomputedを使う
// - 以前の書き方だとwatchに相当する
watch(
// 監視対象のプロパティ
() => state.inputValue,
// 変更があったときのアクション。ここではコンソールに出力している
(new, old) => console.log(`新しい値は ${new}`)
);
// 複数プロパティを同時に監視する場合
watch(
() => [state.a, state.b],
([newA, newB], [oldA, oldB]) => console.log(
`新しいaは ${newA}, 新しいbは ${newB}`
)
);
// 中略
}
})
```