搜索文档 /

将照片保存到文件系统

我们现在可以拍摄多张照片,并将它们显示在应用程序的第二个选项卡的照片库中。然而,这些照片目前并没有被永久存储,所以当应用程序关闭时,它们将会丢失。

文件系统API

幸运的是,将它们保存到文件系统只需要几个步骤。首先打开 usePhotoGallery 钩( src /钩/ usePhotoGallery.ts ),并获得访问 writeFile 方法从 文件系统 类:

我们将使用 writeFile 方法,但我们稍后会使用其他方法,所以我们现在继续导入它们。

接下来,创建两个新函数 usePhotoGallery


              出口
             
              函数
             
              usePhotoGallery
              
              
             
              
             
              常量
             savePicture
              
             
              异步
             
              
             照片
              
             CameraPhoto
              
             文件名
              
             
              字符串
              
              
             
              承诺
              <
             照片
              >
             
              =>
             
              
             
              常量
             base64Data
              
             
              等待
             
              base64FromPath
              
             照片
              
             webPath
              
              
              
             
              常量
             savedFile
              
             
              等待
             文件系统
              
              writeFile
              
              
             路径
              
             文件名
              
             数据
              
             base64Data
              
             目录
              
             目录
              
             数据
              
              
              
             
              //使用webPath来显示新图像而不是base64,因为它是
             
              //已加载到内存
             
              返回
             
              
             filepath
              
             文件名
              
             webviewPath
              
             照片
              
             webPath
              
              
             
              
              
             
              
             
              出口
             
              异步
             
              函数
             
              base64FromPath
              
              路径
               
              
               字符串
              
              
             
              承诺
              <
              字符串
              >
             
              
             
              常量
             响应
              
             
              等待
             
              获取
              
             路径
              
              
             
              常量
             
              
             
              等待
             响应
              
              
              
              
              
             
              返回
             
              
             
              承诺
              
              
              解决
               
              拒绝
              
             
              =>
             
              
             
              常量
             读者
              
             
              
             
              FileReader
              
              
              
             读者
              
             onerror
              
             拒绝
              
             读者
              
              onload
             
              
             
              
              
             
              =>
             
              
             
              如果
             
              
              typeof
             读者
              
             结果
              ===
             
              “字符串”
              
             
              
             
              解决
              
             读者
              
             结果
              
              
             
              
             
              其他的
             
              
             
              拒绝
              
              方法没有返回字符串
              
             
              
             
              
              
             读者
              
              readAsDataURL
              
             
              
              
             
              
              
              
             
              
             
复制 复制

base64FromPath方法是一个辅助util,它从提供的路径下载文件,并返回该文件的base64表示。

我们经过 cameraPhoto 对象,它表示新捕获的设备照片,以及fileName,它将为要存储的文件提供路径。

接下来我们使用电容器 文件系统API 将照片保存到文件系统中。我们首先将照片转换为base64格式,然后将数据提供给Filesystem writeFile 函数。

最后,调用 savePicture 并直接在调用的下方传递cameraPhoto对象和文件名 setPhotos takePhoto 方法。以下是完整的方法:


              常量
             
              takePhoto
             
              
             
              异步
             
              
              
             
              =>
             
              
             
              常量
             cameraPhoto
              
             
              等待
             相机
              
              getPhoto
              
              
             resultType
              
             CameraResultType
              
             Uri
              
             
              
             CameraSource
              
             相机
              
             质量
              
             
              One hundred.
             
              
              
              
             
              常量
             文件名
              
             
              
             
              日期
              
              
              
              取得时间
              
              
             
              +
             
              “jpeg”
              
             
              常量
             savedFileImage
              
             
              等待
             
              savePicture
              
             cameraPhoto
              
             文件名
              
              
             
              常量
             newPhotos
              
             
              
             savedFileImage
              
             
              ...
             照片
              
              
             
              setPhotos
              
             newPhotos
              
              
             
              
              
复制 复制

我们走吧!每次拍摄新照片时,它都会自动保存到文件系统中。

以前的
拍照
下一个
在文件系统上加载照片
Baidu