时间戳

首页 > 解决方案 > vue.set() 一个 vuex 突变中的数组

javascript - vue.set() 一个 vuex 突变中的数组

问题描述

我正在尝试在我的 vuex 存储中的“updateInformation”突变中 vue.set() 一个数组。

这是我的脚本中的函数：

 updateImagesArrayInMutation(imageFile) {
      let images = [];
      this.images.forEach(imageFile => {
        imageFile.generateBlob(
          blob => {
            let rand = (Math.random().toString(36).substring(2, 16) + Math.random().toString(36).substring(2, 16)).toUpperCase()
            let imagesRef = firestorage.ref('postimages/' + rand)
            console.log("imageRef, imageFile for eachfile", imageFile)
            if(this.images.length < 3) {
              // THIS PUSHES AN EMPTY CROPPA ("CLICK DRAGE IMAGE HERE") // max 5
              this.images.push({})
              console.log("imagesRef", imagesRef.fullPath)
            }
            this.updateImages ({ 
              images: imagesRef.fullPath
            })
          },
          'image/jpeg',
          0.8,
        )
      })
    },
    updateImages(images) {
      console.log("this is value from closure", images)
      this.updateInformation({
        images: images,
        title: this.post.title,
        description: this.post.description
      })
    },

这是我商店中的突变：

  [UPDATE_INFORMATION] (state, info) {
    console.log('[STORE MUTATIONS] - UPDATE_INFORMATION:', info)

    Vue.set(state.newPost.images, 'images', [...info.images])

    // state.newPost.images = info.images
    state.newPost.title = info.title
    state.newPost.description = info.description
    state.newPost.location = info.location
    state.newPost.city = info.city
  },

我可以这样做吗？提前感谢您的任何建议。

标签： javascriptvue.js

解决方案

为什么不这样做：

[UPDATE_INFORMATION] (state, info, payload) {
    state.newPost = {
        ...state.newPost,
        ...info
    }
}

推荐阅读