Using Vue-Router Dynamic Routes to Load Data Chapter 9</div><div v-html="product.body"></div></div>
<page-not-found v-if="productNotFound"></page-not-found>
</div>`,These two new attributes will update when changing the variation. We can also update the
image to the selected variation if it has one. To do this, add a watch object to your
component, which watches the variation variable. When updated, we can check if the
variation has an image and, if so, update the image variable with this property:
const ProductPage = {
name: 'ProductPage',template: `...`,components: {
...
},
data() {
...
},computed: {
...
},watch: {
variation(v) {
if(v.hasOwnProperty('image')) {
this.updateImage(v.image);
}
}
},methods: {
...
}
};