CODEWITHSUNDEEP
vue.jsvuejs3vue-composition-apivue-reactivity
entropyfeverone
entropyfeverone

Reputation: 1572

Is ref() & watch() combination equivalent to computed() in Vue 3?

I have a reactive object

team

and it has a property

players

I want to also make players reactive (ease of use by exporting it from a custom hook).

Are these two pieces of code equivalent ?

(I suppose they are not, but I want to know the gotchas of using one over the other way)

const players = computed(() => team.value.players);

const players = ref(team.value.players);

watch(team, () => players.value = team.value.players);

Which one should I use ? Is there a big difference (optimization ?) What about usage with v-model ?

Upvotes: 2

Views: 2339

Answers (1)

Boussadjra Brahim
Boussadjra Brahim

Reputation: 1

It's recommended to use computed property with getter/setter in order to be able to bind it to v-model :

const players = computed({
 get() => team.value.players,
 set(newVal){
 
 }
});

Upvotes: 2

Related Questions