React Redux Firebase Загрузка файла - PullRequest
Новая
       16

React Redux Firebase Загрузка файла

0 голосов
/ 01 июня 2018

Я новичок, чтобы реагировать.Я пытаюсь загрузить файл в Firebase, и пока все идет хорошо, я не могу сохранить URL-адрес картинки в состоянии pictureUrl.Я извлекаю URL из обещания, и оно работает нормально, но как мне перевести downloadUrl из обещания в состояние pictureUrl?Любые идеи?

Представление данных 

      handleSubmit(e){
          e.preventDefault();
          console.log(this.state.picture)

          this.props.uploadImage(this.state.picture)

        const article = {
          header: this.state.header,
          tagLine: this.state.tagLine,
          articleType: this.state.articleType,
          system: this.state.system,
          body: this.state.body,
          pictureUrl: ???????
      }

      this.props.saveArticle(article);

      console.log('Data saved!')  

      // Resets the state back to nothing
        this.setState({
          header: '',
          tagLine: '',
          articleType: '',
          system: '',
          body: '',
          pictureUrl: ''
        })
      }

Firebase Call To Upload File 

           export function saveArticle(article, file){
                return dispatch => database.push(article);
            }

            export function uploadImage(picture){
                    return dispatch => storage.child('/images/' + picture.name).put(picture).then((snapshot) => {


                        snapshot.ref.getDownloadURL().then(function(downloadURL) { 

                        console.log('File available at: ', downloadURL)
                        })
                    })

                    console.log(picture)

            }

1 Ответ

0 голосов
/ 24 декабря 2018

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

Вы должны вызвать переменные обратно.

Например 

render{
return{
<PDF
 file={this.state.pdfUrl}
  />
 }
}

https://medium.com/@650egor/react-30-day-challenge-day-4-firebase-photo-upload-delete-f7c59d73ae36

Загрузкаизображений из базы данных Firebase Realtime + хранилище

...