<template>
<div>
<input type="file" id="dosya" @change="putDesign()" />
</div>
</template>
<script>
import { initializeApp } from "firebase/app";
import { getStorage, ref } from "firebase/storage";
const firebaseConfig = {
apiKey: ,
authDomain: ,
databaseURL: ,
projectId: ,
storageBucket: ,
messagingSenderId: ,
appId: ,
};
const app = initializeApp(firebaseConfig);
const storage = getStorage(app);
export default {
data() {
return {
fileName: "",
};
},
methods: {
putDesign() {
this.fileName = document.getElementById("dosya").files[0].name;
const designRef = ref(storage, "design/" + this.fileName);
designRef.put(this.fileName);
},
},
};
</script>
Hello friends, I am trying to add files to Firebase Storage, but it gives me this error: designRef is not a function. I tried some other ways too that I found on internet, but I couldn't make it. How can I add files to Firestore Storage?
The Modular SDK doesn't have a put() method. You need to use uploadBytes. Also, the file itself must be passed instead of just filename:
const file = document.getElementById("dosya").files[0]
this.fileName = file.name;
const designRef = ref(storage, "design/" + this.fileName);
uploadBytes(designRef, file).then((snapshot) => {
console.log('Uploaded:', file.name);
});