Javascript Vue 3 - 在創建新的身份驗證帳戶到 Firebase Auth 后無法將圖像上傳到 Firebase 存儲

Question

我嘗試制作一個簡單的注冊表單，管理員可以在其中創建新用戶，包括新用戶的照片個人資料，但是在創建身份驗證后嘗試上傳圖像時返回錯誤（用戶已在 Firebase 身份驗證中創建）

無法讀取 null 的屬性（讀取“文件”）

const photo = ref(null)

const formData = reactive({
    fn: "",
    ln: "",
    email: "",
    password: "",
})

const signUp = async () => {
    const result = await v$.value.$validate()
    if(result){
        createUserWithEmailAndPassword(auth, formData.email, formData.password)
        .then(function(data) {
            const imagesRef = stRef(storage, 'images/'+data.user.uid)
            uploadBytes(imagesRef, photo.value.files[0]).then((snapshot) => {
                console.log(photo.value.files[0]);
            })
            setDoc(doc(db, "users", data.user.uid), {
                fn : formData.fn,
                ln : formData.ln,
                uid: data.user.uid,
                email: formData.email,
            })
            closeModal()
            router.go()
            alert("Success, form submitted.")
        })
    .catch(error => {
        switch (error.code) {
            case 'auth/invalid-email':
                errMsg.value = 'Invalid email address or password';
                break;
            case 'auth/user-not-found':
                errMsg.value = 'User not found';
                break;
            case 'auth/wrong-password':
                errMsg.value = 'Invalid email address or password';
                break;
            case 'auth/internal-error':
                errMsg.value = 'Invalid email address or password';
                break;
            case 'auth/missing-email':
                errMsg.value = 'Fill email address or password field';
                break;
            case 'auth/email-already-in-use': 
                errMsg.value = 'Email already used';
                break;
            default:
                errMsg.value = error.message;
                break;
        }
    });
    } else {
        alert(errMsg.value, "Form failed to submitted")
    }
}

謝謝你的幫助

Answer 1

您似乎沒有在此代碼中更新photo參考值（您聲明為ref(null) ，所以錯誤是因為photo.value是 null 在線：

uploadBytes(imagesRef, photo.value.files[0])

不確定photo.value應該是什么，但您需要確保在signUp中訪問它之前為其分配一些內容。