自定义缩小器问题（或者说是我保存/加载组件的方式）
是的，你说得对。这是因为函数不可序列化，因此当 grapesjs 调用 'JSON.stringify（Component）' 时，就是直接被抄袭了。 你的解决方案是覆盖自定义组件中的“toJSON”方法 “''js 编辑。DomComponents.addType（'grid-col'， { 型号：...... 默认值：... // 这里你定义可调整大小 ... 然后避免储存 toJSON（） { const obj = defaultModel.prototype.toJSON.apply（this， arguments）; 删除obj.resizable; 返回OBJ; } ... 视图：... }); ```
阅读下方完整回答 ↓问题
我正在尝试为我的一个组件制作一个定制的缩小器。这是一个基于Flexbox的网格/列布局，我希望用户能够调整一列大小（固定宽度），其他列填满剩余空间。 我已经为我的列自定义了一个组件，所以我给它添加了调整尺寸配置，包括一个 updateTarget（） 函数，效果非常好。但是，如果我保存了这些内容，然后再回来查看，updateTarget（） 函数就永远不会被调用。我添加到画布中的新组件都能正常工作，但现有的组件却不行。 这是我的配置： “'' js { 类型：“网格鞍部”， “自定义名称”：“列”， 类：[''flex-item']， 可调整大小：{ TL： 0， TC： 0， TR： 0， BL：0，BC：0，BR：0， updateTarget： function（element， rect， context） { console.log（'custom updateTarget invoked'）; var elStyle = element.style; elStyle.width = rect.w + 'px'; elStyle.minWidth = rect.w + 'px'; elStyle.maxWidth = rect.w + 'px'; elStyle.flexGrow = 0; } } } 注意，没有引用 updateTarget（） 函数。 我猜编辑器加载...
回答（3）
是的，你说得对。这是因为函数不可序列化，因此当 grapesjs 调用 'JSON.stringify（Component）' 时，就是直接被抄袭了。 你的解决方案是覆盖自定义组件中的“toJSON”方法 “''js 编辑。DomComponents.addType（'grid-col'， { 型号：...... 默认值：... // 这里你定义可调整大小 ... 然后避免储存 toJSON（） { const obj = defaultModel.prototype.toJSON.apply（this， arguments）; 删除obj.resizable; 返回OBJ; } ... 视...
谢谢@artf这招起了作用。
@thecodefish 如何更改Resizer属性的初始状态？如果我用的是grapesjs-preset-webpage，这个配置会放在哪里？就在grapesjs.init{...}下面？ 我想专门为图像组件设置最小尺寸，并禁用一些角点，比如 tl、tc、tr。
相关问答
通过相似的问题讨论继续研究。
问题 #710
让整个元素都能拖动，而不仅仅是手柄
我正在修改手柄，除了有手柄外，我还希望整个元素都能拖拽。看代码，我猜我只需要在select时给可拖拽的元素附加'tlb-move'命令。 上述代码在选择状态下，将选中的组件写入控制台。从这里开始，我认为需要添加一个用于拖拽的事件监听器，但我尝试用 '.on（）' 附加监听器都失...
问题 #507
上传文件在丢弃文件上被调用了两次？
我有一个编辑器，初始化如下： 如果我把图片添加到画布，然后试图通过拖拽到模态的投放区域上传新图片，uploadFile函数会被调用两次。点击上传区域，然后从Windows对话框中选择文件上传，效果很好，它只调用该函数一次。
问题 #1890
禁用拖曳功能，而不是功能
我想创造属于自己的拖拽和放置能力。我很喜欢 Grapesjs，但真的希望能更好地控制在编辑器区域里拖拽元素的工作。有没有办法禁用内置的方法，这样我就能自己创建？我知道设计模式在路线图上，但我现在需要这个功能，所以我自己也要添加，不过首先我得阻止 Grapesjs 的默认功能干扰...
问题 #1568
列表/数组特征
你好， 我正在尝试编写一个特征，允许创建表单列表并在模型中生成相应的表单。到目前为止，我有这个： “JavaScript 编辑。TraitManager.addType（'list'， { 事件：{ 'keyup'： 'onChange' }, getInputEl： func...
与此问题匹配的付费插件
根据问题关键词和标签相关性精选，助你更快交付。
正在加载付费插件推荐……
相关教程
关于同一主题的深入指南。
浏览插件分类
直接跳转到市场上的插件分类页面。