首页 > 解决方案 > 反应本机错误“`filePath`需要一个字符串值”

问题描述

我有一些代码可以使用 React Native 打开相机并使用 FireBase 保存图像,但它给了我一个错误,说filePath需要一个字符串值。

在此处输入图像描述

这是我的代码:

 const openCamera = ()=>{
    launchCamera({quality:0.5},(fileobj) =>{
        console.log(fileobj)
        const uploadTask = storage().ref().child(`/items/${Date.now()}`).putFile(fileobj.uri)
        uploadTask.on('state_changed',
        (snapshot) => {
            var progress = (snapshot.bytesTransferred / snapshot.totalBytes) * 100;
            if (progress == 100){alert("Uploaded")}
        },
        (error) => {
            alert("something went wrong")
        },
        () => {
            uploadTask.snapshot.ref.getDownloadURL().then((downloadURL) =>{
                console.log(downloadURL)
                setImage(downloadURL)
            });
        }
        );
    })
   }

标签: javascriptreactjsreact-nativefile-upload

解决方案


launchCamera方法接受将使用响应对象调用的回调。这个响应对象有四个键;didCancel, errorCode,errorMessageassets.

assets是所选媒体的数组,因此您需要获取第一个媒体。

const openCamera = () => {
  launchCamera({ quality: 0.5 }, (result) => {
    if (result.errorCode || result.didCancel) {
      return console.log('You should handle errors or user cancellation!');
    }
    const img = result.assets[0];
    const uploadTask = storage()
      .ref()
      .child(`/items/${Date.now()}`)
      .putFile(img.uri);

    uploadTask.on(
      'state_changed',
      (snapshot) => {
        var progress = (snapshot.bytesTransferred / snapshot.totalBytes) * 100;
        if (progress == 100) {
          alert('Uploaded');
        }
      },
      (error) => {
        alert('something went wrong');
      },
      () => {
        uploadTask.snapshot.ref.getDownloadURL().then((downloadURL) => {
          console.log(downloadURL);
          setImage(downloadURL);
        });
      },
    );
  });
};

推荐阅读