ref とreactive、toRefs、toRef

ref とreactive

refも内部的にはreactiveを使っている。refもオブジェクト型に使える上、reactiveはいくつか制約があるため、基本的にrefを使う。

toRefs、toRef

toRef

オブジェクトの一部のプロパティをrefに変換する。
元の値がreactiveの場合、どちらもリアクティブなため、どちらかの値を変更すると、もう片方の値も変わる。

toRefs

オブジェクトの全てのプロパティをrefに変換する。
分割代入やスプレッドで使える。

参考

• 【Vue】reactive()って要らなくね？ref()だけでよくね？ #Vue.js - Qiita
• リアクティビティー API: ユーティリティー | Vue.js