Обновите изображение, выбранное в диалоговом окне подтверждения

#javascript #vue.js #vuejs2 #vuetify.js

#язык JavaScript #vue.js #vuejs2 #vuetify.js

Вопрос:

У меня есть сетка изображений, из которых я хочу сделать выбор и обновить значение с помощью выбранного изображения. Прежде чем сделать это, я надеюсь, что появится приглашение, которое просто проверит, хотите ли вы обновить или отменить / отклонить.

Что мне нужно сделать, чтобы обновить «this.backGroundUrl» в приведенном ниже методе с новым выбранным изображением?

Сетка изображений:

 lt;v-col  v-for="(asset) in assets"  :key="asset._id"  cols="4"  gt;  lt;v-img  :src="getThumbnail(asset)"  @click="confirmDialog = true"  /gt;  lt;/v-colgt;  

Подтвердите компонент:

 lt;ConfirmDialog  v-if="confirmDialog"  v-model="confirmDialog"  @cancel="confirmDialog = false"  @confirm="updatedBackgroundImage()" /gt;   

Активы:

 computed: {  ...mapState('assets', ['assets']),  

Метод:

 methods: {  getThumbnail (asset) {  return this.getMediaUrl(asset.thumbnailUrl)  },  getMediaUrl (url) {  return process.env.VUE_APP_BACKEND_URL   url  },  updatedBackgroundImage () {  // this.currentConnect.backGroundUrl = ??  this.confirmDialog = false  }  

Ответ №1:

Прежде чем открыть диалоговое окно, спрячьте URL-адрес.

 @click="showDialog(asset)"  
 showDialog(asset) {  this.theAssetToConfirm = asset  this.confirmDialog = true }  
 updatedBackgroundImage () {  this.currentConnect.backGroundUrl = this.theAssetToConfirm  this.confirmDialog = false }