Реализован калькулятор прогресса для задачи загрузки, но он не добавляет URL-адрес элемента должным образом с помощью этого метода - PullRequest
Новая
       27

Реализован калькулятор прогресса для задачи загрузки, но он не добавляет URL-адрес элемента должным образом с помощью этого метода

0 голосов
/ 08 июня 2019

Я хочу добавить калькулятор прогресса для этой задачи, чтобы отобразить обратную связь с пользователем.

Я пробовал это, но он не добавляет URL к моему setUrl(url) хуку, который вызывает проблему. 

const onSubmit = (e) => {
        e.preventDefault();

        if(eventImage) {

        const uploadImage = storage.ref(`EventImages/${values.eventName}`).put(eventImage);
        uploadImage.on('state_changed',
            (snapshot) => {
                    // progrss function ....
                    const progress = Math.round((snapshot.bytesTransferred / snapshot.totalBytes) * 100);
                    this.setState({progress});
                  }
            (error) => {
                console.log(error);
            },
            () => {
                storage.ref('EventImages').child(values.eventName).getDownloadURL().then((url) =>{
                    console.log(url);
                    setUrl(url);
                })

            }
        );
        }

        dbref.add({
            eventName: values.eventName,
            eventVenue: values.eventVenue,
            eventAddress: values.eventAddress,
            eventCategory: values.eventCategory,
            eventOrganizer: values.eventOrganizer,
            eventPhone: values.eventPhone,
            eventEmail: values.eventEmail,
            eventDetails: values.eventDetails,
            eventDate: selectedDate.toDateString(),
            eventTime: selectedDate.toLocaleTimeString(),
            eventImgUrl: eventImageUrl
        }).then((docRef) => {
            console.log("Document written with ID: ", docRef.id);
            setValues('');
            setImg('');
            setUrl('');
        }).catch((error) => {
            console.error("Error adding document: ", error);
        });

    }

Я пробовал это, но он не добавляет URL к моему setUrl(url) хуку, который вызывает проблему.

1 Ответ

0 голосов
/ 08 июня 2019

Я не уверен, правильно ли я понимаю. Но если вы пытаетесь сохранить URL загрузки изображения в базе данных, то вы должны сделать это в обратном вызове, который запускается при определении URL загрузки. Это единственное место / момент, когда вам гарантированно известен URL-адрес загрузки.

Итак, переместите код, который пишет в базу данных, в обратный вызов getDownloadURL().then(): 

const uploadImage = storage.ref(`EventImages/${values.eventName}`).put(eventImage);
uploadImage.on('state_changed',
    (snapshot) => {
            // progrss function ....
            const progress = Math.round((snapshot.bytesTransferred / snapshot.totalBytes) * 100);
            this.setState({progress});
          }
    (error) => {
        console.log(error);
    },
    () => {
        storage.ref('EventImages').child(values.eventName).getDownloadURL().then((url) =>{
            dbref.add({
                eventName: values.eventName,
                eventVenue: values.eventVenue,
                eventAddress: values.eventAddress,
                eventCategory: values.eventCategory,
                eventOrganizer: values.eventOrganizer,
                eventPhone: values.eventPhone,
                eventEmail: values.eventEmail,
                eventDetails: values.eventDetails,
                eventDate: selectedDate.toDateString(),
                eventTime: selectedDate.toLocaleTimeString(),
                eventImgUrl: eventImageUrl
            }).then((docRef) => {
                console.log("Document written with ID: ", docRef.id);
                setValues('');
                setImg('');
                setUrl('');
            }).catch((error) => {
                console.error("Error adding document: ", error);
            });
        })

    }
);
...