无法使用 Ionic 和 Vue.js 保存文件

Posted 2023-02-22

【中文标题】无法使用 Ionic 和 Vue.js 保存文件

【英文标题】：Can't save file using Ionic and Vue.js

【发布时间】：2020-12-22 18:48:02

【问题描述】：

我正在尝试保存从 API 获得的图像并保存在我的应用程序中。我目前正在使用 Ionic 5 和 Vue.js。

为了保存图片，我使用ionic native file library.

问题是我无法让它在 android、ios 或 Web 上运行。我不太了解这个库是如何工作的，我尝试过两种方式使用它：

我尝试的第一件事是用作静态方法，但它不起作用，所有参数都返回null。

import  File  from '@ionic-native/file';

private async getImage(token: string, model: Model): Promise<Model> 
    const  thumbnailLink  = model.images;
    const response = await axios.get(thumbnailLink,  responseType: 'arraybuffer' );
    File.writeFile(`$token/model-$model.id`, 'thumbnail.png', response.data);

我尝试的第二种方法是实例化类，它也没有成功。

import  File  from '@ionic-native/file/ngx';

private async getImage(token: string, model: Model): Promise<Model> 
    const  thumbnailLink  = model.images;
    const response = await axios.get(thumbnailLink,  responseType: 'arraybuffer' );
    (new File()).writeFile(`$token/model-$model.id`, 'thumbnail.png', response.data);

如果有人能帮我弄清楚该怎么做，我已经尝试解决一天了。谢谢！

【问题讨论】：

在第二个示例中，您从file/ngx 导入File，但ngx 代表angular version x。我从未使用过 Vue 和 Ionic，但是在 Angular 中，您需要在类的构造函数中注入 File。

【参考方案1】：

https://capacitorjs.com/docs/apis/filesystem

import  Plugins  from "@capacitor/core";
const  Filesystem  = Plugins;

稍后在您的代码中

Filesystem.write(...)