CODEWITHSUNDEEP
javascriptvue.jsvuex
softcode
softcode

Reputation: 4678

Binding img src

I have an img tag in a Vue component with a binded src attribute to Vuex state.

<img :src="this.$store.state.imageDataURI">

I am successfully updating that state object in Vuex (see below).

However the img tag does not get rendered (see below).

I can fix this with getters but just curious as to why this doesn't work. I suspect this has to do with Vue's reactivity model.

Any ideas?

enter image description here

enter image description here

Upvotes: 0

Views: 1797

Answers (1)

Justin MacArthur
Justin MacArthur

Reputation: 4050

When attaching to bindings, this isn't needed and if I'm remembering right can cause issues like this.

Also your store structure looks like you have a module imageStore this would namepace of the imageDataURI element.

Try:

<img :src="$store.state.imageStore.imageDataURI">

Upvotes: 2

Related Questions