首页 > 解决方案 > 如何以 JSON 格式下载带有 blob 的 VUEX 商店

问题描述

我的 Vuex 商店中有 blob,我想将应用程序的状态下载为 .JSON 并恢复它。

一般来说, JSON.stringify(store.state,...) 在没有 blob 的情况下效果很好。我只是不知道如何将 Blob 存储到 JSON 中。

这是我的代码。-Block 包含我将 BLOB 转换为 JSON的if(value instanceof Blob)尝试。

const s = JSON.stringify(store.state
      , (key, value) => {
        // let process = true;
      if (typeof value === 'object') {


        if(value instanceof Blob){

          //I can't get this to work:


          // const reader = new FileReader();

          // // let process = false;
          // reader.onload = function(event){
          //   console.log(JSON.stringify(reader.result));

          //   value = JSON.stringify(reader.result);
          //   return value;
          // };

          // reader.readAsText(value);
          // process = false;

          }

        // Duplicate reference found, discard key
        if (cache.includes(value)) return;

        // Store value in our collection
        cache.push(value);
       }
       if(process){
      return value;
       }
    })

    //download
    const newBlob = new Blob([s], { type: 'application/json;' });
    const filename = `jam-along-${new Date().getTime()}.json`;
    saveAs(newBlob, filename);
    cache = [];


  }

另一个想法是使用 Vuex-Persist 下载带有自定义的商店saveState: (key, state, storage) =>{...,但我无法让它工作。我不希望 vuex-persist 在 sessionStore 或 localStorage 中做任何事情,我想saveState从外部触发而不改变存储。

有什么方法可以下载和恢复我的 vuex 商店?

谢谢!

标签: javascriptjsonvue.jsblobvuex

解决方案


推荐阅读