CODEWITHSUNDEEP
vue.js
skunkwerk
skunkwerk

Reputation: 3070

Multiple instances of component on page, but only one updating

I have a Vue.js single-file component that I'm using twice on a page.

The component displays a list which is populated from an AJAX call. However, only the second instance updates properly once I have the AJAX response.

My single-page component looks like this: https://paste.ee/p/W9vVm My page which includes 2 instances of the component is this: https://paste.ee/p/JmMpd

I can't seem to figure out what's going wrong. When I replace the AJAX call result with just a hard-coded value, it still doesn't work - only the second instance gets the update.

Is there something wrong with how I'm using v-if with the content value?

Upvotes: 0

Views: 274

Answers (1)

fullmetal
fullmetal

Reputation: 414

Well, you are not using the Vue upto the fullest in this example so what you can do is use props in the mix and move the created() and methods from the ContentSelector.vue to your single page component

As shown in the below link

https://paste.ee/p/9GBZ9

Upvotes: 1

Related Questions