sineld biliyorum hocam fakat baktığım bazı durumlarda kafa karışıklığı yarata biliyor. İkiside değişikliklere tepki veriyor, ikisi ile de değer set edebiliyoruz mesela
computed: {
fullName() {
return this.firstName + ' ' + this.lastName;
}
}
```
watched: {
firstName() {
this.fullName = this.firstName + ' ' + this.lastName;
},
lastName() {
this.fullName = this.firstName + ' ' + this.lastName;
}
}
Şöyle kullanımlar da gördüm
<template>
<div>
<p>Ad: {{ name }}</p>
<input v-model="name" placeholder="Adınızı girin">
<p>{{ greeting }}</p>
</div>
</template>
<script>
export default {
data() {
return {
name: 'John',
greeting: ''
};
},
watch: {
name(newValue) {
this.greet();
}
},
methods: {
greet() {
this.greeting = 'Merhaba, ' + this.name + '!';
}
}
};
</script>
veya
export default {
data() {
return {
actorId: null,
movies: [],
};
},
methods: {
getMovies() {
// http request
axios.get(`movies/actor/${this.actorId}`)
.then(resp => {
this.movies = resp.data;
});
}
},
watch: {
actorId(val) {
if(val) this.getMovies();
}
}
}
ve de böyle bir şey
watch: {
movie(movie) {
fetch(`/${movie}`).then((data) => {
this.movieData = data;
});
}
}
aralarındakı farkı biliyorum mesela computed değer döndürür, eşzamanlıdır. Watch eşzamansızdır, değişimleri izler. Mesela istek attığımız zaman hangisi ile atmamız gerek methods ile mi computed ile mi yoksa watch ile mi. Farklarını biliyorum fakat bir proje zamanı birleştirip hangisini nerede kullanmalıyım diye kafam karışıyor