是否有将数据存储为 json 的解决方案？

Question

我使用 Grapesjs 编辑器。现在我只知道一种存储内容的方法。

情况如下：

我有 Grapesjs 块 'About us'，我在其中填充了子卡组件。然后我用 editor.getHtml() 得到内容，我可能会得到这样的东西：

<section class="sect-home-about">
    <div class="container">
        <div class="title-sect"><h2>Über uns</h2></div>
        <div class="about-wrap">
            <div class="about-line" id="i94s">
                <div class="about-itm">
                    <div class="about-itm-inner">
                        <a href="#" class="about-itm-photo"><span class="img-inner-box" id="im8d1">
                            <img src="/css/img/square.png" alt="base"/>
                            <img src="/img/about/1.png" alt="" title="" class="main-img"/></span></a>
                        <div class="about-itm-txt">
                            <div class="about-itm-name">Andrea</div>
                            <div class="about-itm-brief">Weit hinten, hinter den Wortbergen, fern der Länder Vokalien
                                und Konsonantien leben die Blindtexte. Abgeschieden wohnen sie <a href="#">mehr lesen</a>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</section>

然后我可以保存到数据库，然后在前端显示。但我不想存储无用的html。这里可编辑的项目应该是.title-sect、.about-itm-name、.about-itm-bries和图像数据。我只想存储 json 数据，然后用正确的 html 在前端显示它，因为 html 是相同的，我知道它..

有这样的解决方案吗？

Answer 1

初始化 GrapesJS 后，在事件中添加以下代码以获取 JSON 数据输出。

JSON.stringify(editor.getComponents())

在这里，Component 重写了 toJSON 函数，因此可以正常工作。

是否有将数据存储为 json 的解决方案？

Is there a solution to store data as json?

grapesjs