TypeError: Cannot read property '0' of undefined firebase and vuex

Question

I'm using vuex action, it happen when I try to get the urlof the uploaded image everything is fine and the image is saved in firebase, but I can't get the downloadUrl and add it the reference of downloadurl to my meetup database

My code look like this

actions: {
    createMeetup ({commit, getters}, payload) {
      const meetup = {
        title: payload.title,
        location: payload.location,
        description: payload.description,
        date: payload.date.toISOString(),
        creatorId: getters.user.id
      }
      let imageUrl
      let key
      firebase.database().ref('meetups').push(meetup)
        .then((data) => {
          key = data.key
          return key
        })
        .then(key => {
          const filename = payload.image.name
          const ext = filename.slice(filename.lastIndexOf('.'))
          return firebase.storage().ref('meetups/' + key + '.' + ext).put(payload.image)
        })
        .then(fileData => {
          console.log(fileData)
          imageUrl = fileData.metadata.downloadURLs[0]
          return firebase.database().ref('meetups').child(key).update({imageUrl: imageUrl})
        })
        .then(() => {
          commit('createMeetup', {
            ...meetup,
            imageUrl: imageUrl,
            id: key
          })
        })
        .catch((error) => {
          console.log(error)
        })
    }

Can you make sure that fileData, key, filename values exist? maybe just do console & comment out the output in your code — Sajib Khan
– Sajib Khan, Commented Nov 5, 2018 at 13:39

EMATade · Accepted Answer · 2018-11-05 13:56:31Z

holla i ask i answer my self i got the solution thanks guys for not answering

createMeetup ({commit, getters}, payload) {
          const meetup = {
            title: payload.title,
            location: payload.location,
            description: payload.description,
            date: payload.date.toISOString(),
            creatorId: getters.user.id
          }
          let imageUrl
          let key
          firebase.database().ref('meetups').push(meetup)
            .then((data) => {
              key = data.key
              return key
            })
            .then(key => {
              const filename = payload.image.name
              const ext = filename.slice(filename.lastIndexOf('.'))
              return firebase.storage().ref('meetups/' + key + '.' + ext).put(payload.image)
            })
            .then(snapshot => {
              return new Promise((resolve, reject) => {
                snapshot.ref.getDownloadURL().then(url => {
                  snapshot.downloadURL = url
                  resolve(snapshot)
                })
              })
            })
            .then((snapshot) => {
              imageUrl = snapshot.downloadURL
              return firebase.database().ref('meetups').child(key).update({imageUrl: imageUrl})
            })
            .then(() => {
              commit('createMeetup', {
                ...meetup,
                imageUrl: imageUrl,
                id: key
              })
            })
            .catch((error) => {
              console.log(error)
            })
        },

Collectives™ on Stack Overflow

TypeError: Cannot read property '0' of undefined firebase and vuex

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related