Я хочу добавить обработчик прогресса или обратную связь для этой функции отправки, чтобы пользователь знал, когда задача завершена - PullRequest
Новая
       18

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

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

Я хочу использовать Или любой компонент обратной связи Material-UI для захвата хода отправки формы 

const onSubmit = (e) => {
    e.preventDefault();
    if (eventImage) {
        const uploadImage = storage.ref(`EventImages/${values.eventName}`)
        uploadImage.put(eventImage).then(() => {
            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: url
                }).then((docRef) => {
                    console.log("Document written with ID: ", docRef.id);
                    setValues("");
                    setImg("");
                    setImgName("");
                }).catch((error) => {
                    console.error("Error adding document: ", error);
                });
            })
        })

    }
    }

Я хочу использовать любой компонент обратной связи Material-UI для достижения этой цели.

1 Ответ

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

Обычно в таких ситуациях используется индикатор выполнения, чтобы пользователь знал, какая часть задачи выполнена / остается.

ИМО, показывающая процент выполненного и / или оставшегося времени, полезна для. (время немного сложнее реализовать)

Индикатор выполнения пользовательского интерфейса материала: https://material -ui.com / components / progress / # linear-buffer

Это может помочь?

У них также есть пример с исходным кодом. Дайте мне знать, если вам нужно больше информации

...