问题 #1741💬 已回答提出于 2019年1月23日作者 ateebahmed1 个反应

:在前端查看页面时无法渲染 GrapesJS 的 HTML/CSS 版本 v0.14.50

快速解答作者 ateebahmed1

@CaseJnr 没有

阅读下方完整回答 ↓

问题

我已经建了一个页面,想在前端渲染,我实施的策略是保存我的HTML和JSON风格对象,然后在前端传递它们。然后我初始化 GrapesJS,并将其样式设置为我从 DB 获取的 JSON,然后从该对象获取 CSS。 渲染编辑器时 “''js VAR Editor = Grapesjs.init({ // ...配置 }) editor.setStyle(JSON.parse([json array from db])) editor.setComponent([数据库页面HTML文本]) 我用编辑器搭配CMS时也做过同样的事,效果很好,但不知怎么的,我无法在前端从JSON加载完整的CSS。 如果我做错了,请纠正我。 谢谢 这就是应该的样子,使用编辑器时显示的,它在浏览器上渲染的CSS是正确的,但我尝试用无痕模式时结果不同 ![截图 2019-01-23 凌晨5 48 35](https://user-images.githubusercontent.com/18216278/51575161-c5158c80-1ed2-11e9-805d-6cc496fb297e.png) 这就是我得到的 ![截图 2019-01-23 凌晨5点53分](https://user-images.githubusercontent.com/18216278/51575238-39503000-1ed3-...

回答(3)

ateebahmed2020年2月26日

@CaseJnr 没有

ateebahmed2019年1月23日

阅读这里关于如何在数据库中存储模板的方法:https://grapesjs.com/docs/modules/Storage.html#setup-remote-storage

在前端,你不需要编辑器,只需打印存储在数据库中的HTML和CSS

实际上我不能同时存储 CSS 和 HTML 和样式,因为我用的是 CMS 表格字段,只用它的 API 保存正文内容,不能在表格中创建额外字段,而且我保存样式是因为不想失去网站响应性。

如果我把最终CSS保存在数据库里而不是样式里,然后通过setStyle在编辑器里恢复它们,我会丢失什么吗?

相关问答

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

问题 #2635

在编辑器中加载外部CSS

你好,我查了很多资料,但没找到如何在编辑器里加载CSS文件的方法 我的代码 关于其他问题,我也要补充 斯泰尔斯:[\'http://localhost/flexidev/templates/shaperhelix3/css/template.css\'] 没有真正的错误,但也没...

3 个回答更新于 2021年3月16日

问题 #1466

编辑已保存的html编辑器.set组件滑块加载问题

我正在做一个项目,集成了 grapesJs 让用户构建模板,保存到数据库中,并编辑这些已保存的模板。 我最近添加了滑块插件,现在用户可以创建模板,但编辑时会引发JavaScript问题, 我用 editor.setComponents 编辑用户模板,并在 editor.setC...

3 个回答更新于 2019年9月29日

问题 #2120

Body(#wrapper)的CSS属性在editor.setComponents(html)之后不可编辑;

当我用数据库刷新保存页面时,html 和 css 的设置是这样的 $.Ajax({ 网址:“../feeder.php“, 类型:“POST”, processData: false, contentType:false, 数据:FD, 成功:function(result){...

1 个回答更新于 2019年7月14日

问题 #3832

每次重载后,CSS 类都会被移除,并且每个 HTML 标签的自动生成 ID(例如:ivj5m-2)都会被更改

葡萄JS版本 [X] 我确认使用最新版本的GrapesJS 你用的是什么浏览器? 铬 可复制演示链接 不是在那里 描述一下那个虫子 如何重现这个bug? 在 React 应用中安装葡萄 js 进入编辑器,拖动一个组件。(示例:文本组件) 使用样式管理器为组件做样式 保存到数据库...

4 个回答更新于 2021年9月29日

与此问题匹配的付费插件

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

查看全部插件

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

免费方案

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

浏览免费插件 →
高级方案

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

浏览高级插件 →

浏览插件分类

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