使用GrapesJs API Storage Manager的自定义StorageManager

时间:2018-07-27 08:30:17

标签: grapesjs

我是GrapesJs的新手,正在尝试实现以下目标:

我正在尝试使用Storage API of GrapesJs

实施自定义存储管理器

我正在尝试从localStorage(即ResponseFromLocalStorage)获取/设置数据。

下面是我的代码:

const editor = grapesjs.init({
    container: '#gjs',
    fromElement: true,
    height: '500px',
    width: 'auto',
    storageManager: { 
        type: 'jekyllLocalStore'
    }
});

//Custom Storage
var storeMan=editor.StorageManager;
//set Config
storeMan.setAutosave=true;
storeMan.setStepsBeforeSave=1;

//Now Add Custom Storage Manager
storeMan.add('jekyllLocalStore', {
    load: function(ResponseFromLocalStorage, clb1) {
          var res = {};
          $.each(ResponseFromLocalStorage,function(key,val){
            console.log(key+'--->'+val);
            if(val) res[key] = val;
          });
          clb1(res); // might be called inside some async method
    },
    store: function(ResponseFromLocalStorage, clb2) {
           localStorage.setItem("wholeRes123",JSON.stringify(ResponseFromLocalStorage));
           clb2(); // might be called inside some async method
    }
});

执行代码时,成功创建了名为 wholeRes123 的localStorage项,并使用了来自 ResponseFromLocalStorage 的数据,但是在存储更改时未在其中更新 wholeRes123

我的理解是,如果将 autoSave 设置为 true ,则存储应在编辑完成后开始,然后是 store:应该执行代码。

我在做什么错?请帮我解决这个问题。

谢谢。

1 个答案:

答案 0 :(得分:-1)

您的代码可能正在保存,但是没有加载。尝试将自动加载添加为true,或者保存后尝试调用