拖拽自定义块后添加外部库
你好, 如果你在这里没有找到答案,可以联系Devfuture Team: https://devfuture.pro/contact/ 我们专注于葡萄JS。
阅读下方完整回答 ↓问题
你好,
我正在定制 GrapesJS,创建组件/块,让用户可以拖到画布上。其中一些模块依赖于外部库,如Bootstrap和FontAwesome..有没有办法检查页面上是否包含必要的依赖关系,如果没有,再添加到页面?
以下是我已经知道的事情。我希望有人能帮我补充对GrapesJS理解的空白,或者指点我一些有用的方向。
-
我知道当用户在页面上放置块时,我可以点击[拖放事件](https://grapesjs.com/docs/api/editor.html#available-events)。然而,不知为何我只能触发“block:drag:stop”这个事件。如果我现在尝试把我的库依赖添加到页面上,我会把所有页面内容都清空。显然我太早添加了依赖,需要等块在页面上渲染后再操作。有没有已知的方法可以做到这一点?还是说这会是我GrapesJS项目独有的?
-
我也知道你可以添加[代码块的脚本依赖](https://grapesjs.com/docs/modules/Components-js.html#basic-scripts)。有没有办法利用这一点?
如果我无法添加必要的标记来包含用户在页面上拖动块时的依赖,有没有办法通知用户“嘿,你需要包含这些依赖......”?
感谢您的关注。
回答(3)
@stljeff1正确的方法是使用[组件相关脚本](https://grapesjs.com/docs/modules/Components-js.html#component-related)来检查依赖是否存在
@artf CSS文件能做到吗?
不过,我还是通过为任何依赖(CSS或JS)创建了自定义块类型,成功“解决”了我的问题。这种自定义类型通过在画布上放置该类型的块时添加自定义回调来扩展默认视图。当触发回调时,我会弹出一个对话框通知用户依赖,如果用户接受,我会将依赖添加到页面。
相关问答
通过相似的问题讨论继续研究。
问题 #2069
'allowScripts: true' 仍然会删除<script>标签
大家好。感谢你创建并维护这个了不起的项目。🙏虫子描述 我有一个模块,可以插入这里指定的脚本:https://grapesjs.com/docs/modules/Components-js.html#basic-scripts 当我把方块拖到画布时,组件确实会把脚本附加到自己身...
问题 #5316
编辑者未订阅选择器:移除
葡萄JS版本[X] 我确认使用最新版本的GrapesJS你用的是什么浏览器? Chrome v115.0.5790.170可复制演示链接 https://jsfiddle.net/BenKhz/yfwqc6mu/1/ 参考[这里的文档](https://grapesjs.com...
问题 #3316
编辑器不会移除死稿块
版本: 0.16.34 你能重现演示中的bug吗? [ ] 是的 [x ] 不 据我了解,导入代码对话框跳过了所有HTML脚本,所以我无法在演示中重现这个问题 预期的行为是什么? 编辑者必须先移除失效脚本块,才能在生成的HTML末尾添加新的脚本块 详细描述那个漏洞* 我在项目中...
问题 #4606
“Commponent & JS”文档页面上的脚本延迟错误。
葡萄JS版本 [X] 我确认使用最新版本的GrapesJS 你用的是什么浏览器? 与问题无关 可复制演示链接 https://grapesjs.com/docs/modules/Components-js.html#basic-scripts 描述一下那个虫子 嘿,与其为这么小...
与此问题匹配的付费插件
根据问题关键词和标签相关性精选,助你更快交付。
正在加载付费插件推荐……
浏览插件分类
直接跳转到市场上的插件分类页面。