[Vuejs]-Vuejs return data to nested variable

0👍

Solved

About my first issue :

I’ve fixed repeating image issue, by removing :file-list="fileList" after that it each option get separate image

About second issue: (Thanks to Qonvex620 ideas)

I have changed my on-change method to

:on-change="handleChange(b)"

Then added this to my data:

return {
  index: '',
}

And finally my functions to:

handleOptionSuccess(res, file) {
  this.optionChilds[this.index].photo = res.data;
},
handleChange(file, fileList) {
  this.index = file;
},

Now each option of mine gets their stored image name.

Hope it help others as well

1👍

I think not the good way but will solve your problem as of now.

In your data put new variable like

data() {
  return {
     selected_index: ''
  }

}

now in your button uploaded, set the value of it that match the current index like this

<el-button size="small" type="primary" @click="selected_index = b">Click to upload</el-button>

so now in your handler you could access it’s index like this

handleOptionSuccess(res, file) {
    this.optionChilds[this.selected_index].photo = res.data;  // this s supposed to set uploaded image name in options `photo: ''`
},

here how you access it inline with your index. Change handleOptionSuccess to this

:on-success="handleOptionSuccess($event, b)"

now in your function handleOptionSuccess you could do it like

handleOptionSuccess(res, index) {
    this.optionChilds[index].photo = res.data;  // this s supposed to set uploaded image name in options `photo: ''`
},

Leave a comment