Upload file to firebase storage folder with Vue js-CodePudding

I'm using Vue js 3 and Firebase 9. I'm trying to upload images to a specific folder, but I'm having troubles. When I do this, it renames file to 'product' and uploads it to the main folder.

uploadImage(e) {
      const file = e.target.files[0];
      const storage = getStorage();
      const storageRef = storageReference(storage, 'products/');
      uploadBytes(storageRef, file);
    }

When I do this, the file goes up with its name but in the main folder.

const storageRef = storageReference(storage, file.name);

how do I make it go up in the products folder with the name it already has? Thank you!

CodePudding user response：

As you will see in the doc, you need to create the StorageReference as follows, with the ref() method:

const storageRef = ref(storage, 'products/'   file.name);

Or with template literals:

const storageRef = ref(storage, `products/${file.name}`);