PageKit — 可自托管的 GrapesJS 建站工具,附完整源码。 获取抢先体验

问题 #1817💬 已回答提出于 2019年2月20日作者 AkibDeraiya1230 个反应

在编辑器渲染块时更改 HTML 内容

快速解答作者 artf

不@AkibDeraiya123如果你试图从“脚本”访问模型,说明你完全误解了它的概念,请仔细阅读这里 https://grapesjs.com/docs/modules/Components-js.html#basic-scripts“脚本”指的是最终的HTML(这里没有“model”、编辑器和GrapesJS),不是编辑器

阅读下方完整回答 ↓

问题

你好@artf 我有一个区块进入了区块管理器

bm.add(“带有搜索栏的header”,
    {
    label: '<div class=“gjs-block-label”>Header with searchbar</div>',
    标签:“1”,
    分类:“作品集”,
    内容:{
    脚本:函数 () {
        我在这里看到新div是通过这个模块添加的。
        const idOfNewDiv = $(this).attr(“id”);
        使用下行我可以编辑DOM,但它不会反映到editor.getHtml()
        document.getElementById(idOfNewDiv).innerHTML = “<p>Hello</p>”;
    },
    内容:'<div class=“testing”></div>'
    }
}
);

和上面的脚本一样,我希望在该块渲染到界面的同时添加动态HTML内容。

我知道我不需要改变DOM。但我需要用模型来更改,但我不知道怎么用 ID/类别的模式来更改。

你能帮我吗?我该怎么实现?

回答(3)

AkibDeraiya123• 2019年2月22日

感谢你的回复@artf, 所以,这意味着我不能在动态内容渲染到编辑器时加载到块里? 如果是,那我该怎么做?

我可以用“this.innerHTML = 'New HTML content''替换整个区块的html吗?

artf• 2019年2月22日

当然可以,但不能通过“脚本”属性。你必须创建一个自定义组件并在那里更新它的模型

相关问答

通过相似的问题讨论继续研究。

问题 #1733

如何移除由添加块管理器脚本添加的脚本标签

你好@artf 我想导出最终/基于制作的HTML内容,但不包括脚本(只导出由块管理器添加的脚本)。 假设我用block-manager添加一个新块,比如 现在当我把这个块放进编辑器时,它会在文档里创建一个 div 标签,同时还会生成类似的脚本, 所以,当我尝试用“editor....

3 个回答更新于 2020年2月4日

问题 #1683

当编辑器或渲染元素带有动态IP时,如何更改ID/类?

你好,@artf, 希望你一切安好。 我有两个关于动态方块添加的问题, 1)能用动态ID渲染方块吗? 2)能否更改 'block:drag:stop' 或 'component:add' Grapesjs 方法中的 id/class/onClick 方法? 这是我的一些代码,...

3 个回答更新于 2019年12月27日

问题 #1669

自定义链接模态不会更新当前文本,而是添加带有链接的另一个文本

你好,Artur, 我正在尝试在RTE中点击链接按钮时创建一个自定义模态。但它不会把选中的文本转换成链接,而是添加了带有链接的另一个文本。 谢谢你......

3 个回答更新于 2019年12月20日

问题 #1499

通过区块的内容脚本进行支配操作(dom)操作可能吗?

嘿!首先非常感谢你打造了这样一个优秀且多功能的工具。 我有可能通过区块的内容脚本来操控该区块的主导元素吗? 例如, 基本上我需要一个类似调查的模块,用户可以放置问题模块,然后输入问题字符串。 再次非常感谢你。

3 个回答更新于 2019年10月19日

与此问题匹配的付费插件

根据问题关键词和标签相关性精选,助你更快交付。

查看全部插件

正在加载付费插件推荐……

免费方案

在以下平台查看开源 GrapesJS 插件: GitHub 或在我们的免费目录中快速搜索。

浏览免费插件 →
高级方案

高级插件提供支持、定期更新和生产就绪的功能——为你节省数天的集成工作。

浏览高级插件 →

相关教程

关于同一主题的深入指南。

全部教程 →

浏览插件分类

直接跳转到市场上的插件分类页面。