问题 #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)

AkibDeraiya1232019年2月22日

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

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

artf2019年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日

问题 #1691

如何在脚本之外使用变量/函数

你好,@artf, 我怎么才能访问这个变量和函数,这些函数不在脚本里? 我的编码是, 我用的是angular.js(Angular1)。上面的代码是控制器文件的。 请问你能帮我解释一下,我该如何在脚本中同时使用这个全局变量和函数吗?

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

问题 #1669

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

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

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

与此问题匹配的付费插件

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

查看全部插件

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

免费方案

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

浏览免费插件 →
高级方案

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

浏览高级插件 →

相关教程

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

全部教程 →

浏览插件分类

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