File path null, Vue Js, Laravel, S3

user_15738027 0
Viewed 163

I try to create a simple file upload with Vuejs and Laravel. But my 'b2b_file' variable seems to be null. in Vue component I have:

<b-form-file
    v-model="b2b_file"
    name="b2b_file"
    multiple>
</b-form-file>

methods: {
    this.b2b_file.map(element => {
        this.productData.b2b_file.push(element)
    })
}

console.log(this.productData.b2b_file) returns the fallowing: https://prnt.sc/1hox1c5

Due to the path being empty in my controller when I try $request->file('b2b_file')->store() i get message: "Call to a member function store() on null", exception: "Error"

What am I doing wrong?

laravel vue.js filepath file-upload amazon-s3
1 Answers

After some intense searching I figure out that I was missing some logic and that's why I was getting null in my controller. Turns out that in the Vue component before making the call to the controller I was missing this:

  const formData = new FormData()
const file = this.productData.b2b_file
    formData.append('b2b_file', file)

axios.post('/api/auth/upload_file', formData)
      .then(response => {
        this.file_path = response.data
      })

and in another Axios call, I am sending the value of this.file_path This way I get the path for the file and $request->file('b2b_file')->store() works as it should

user_157380270
Related