更快发货到生产:葡萄业新动态JS Shadcn

让你的页面构建器强化!GrapesJS Shadcn 增加了实时拖曳预览、富文本/命令、动态数据和画布预设,以加快生产环境的发布速度。

Blocomposer
Blocomposer
2026年6月11日2 个月前
阅读约 2 分钟1,293 次浏览
构建一个可视化页面构建器可能会让你花数周时间在编辑器界面上渲染像素化,而不是完善核心产品。 GrapesJS负责引擎盖下的重任,而我们的 GrapesJS Shadcn 包装纸开箱即提供那种精致专业的外观。
我们最新的版本完全专注于消除开发阻碍,优化用户体验,并为编辑器配备强大且数据驱动的功能。以下是最新内容的解析。

为生产速度而建

我们在整个工作区实施了各种 漏洞修复和UI/UX改进 ,确保工作流程无缝衔接。

这次发布专注于一个主要目标: 快速让用户进入生产环境。我们没有让你一头雾水,而是内置了合理的预设和界面布局模式,这些在多年构建基于模板的编辑器过程中发现,这些都能提升现实世界的用户体验。

智能文本编辑与数学公式

富文本编辑器(RTE)获得了两项重大功能升级:

KaTeX 集成: 

你现在可以用KaTeX语法,直接在画布上渲染和编辑复杂的数学公式。

Katex formulas变量插入命令: 

在文本编辑器中输入 / 会打开命令菜单,让你快速从连接的数据源中插入动态变量。

Text variable

动态数据源与选择器修复

将设计与数据连接现在更加强大:

  • 选择器稳定性: 我们修复了与重命名 CSS 选择器相关的遗留问题,确保设计系统在布局变更时不会出问题。

  • 数据绑定属性: 特征和样式现在可以直接连接到数据源的值。 你可以根据活动数据集动态映射组件属性(比如图片 URL 或文本对齐)。
    Data bound properties

组件拖拽与自定义块

我们彻底重新设计了方块与画布的互动方式:

  • 合理的默认情况: 新的自定义默认块配备了可预测的空状态、预配置的特性以及最相关的风格属性。

  • 视觉拖曳预览: 不再盲目拖延。当你把组件从侧面板拖到画布上时,你会看到元素的实时预览,准确显示它将要落在哪里。

高级图表、表格与自定义选择

为了展示我们框架更深层的能力,我们引入了两个主要组件,基于自定义画布点和特性:


图表组成部分: 

直接在页面布局中直观地绘制数据。

Charts

表格组件: 

轻松构建结构化的行和列。

Table component

  • 选择选项 特性界面: 我们推出了一个简洁的自定义特性界面,专门用于配置可选选项,使长长的下拉属性列表易于管理。

带帆布点的闪电快速建筑

我们希望尽量减少重复的拖拽操作。本次更新引入上下文画布点,允许你点击即时在选中元素前后添加组件。

此外,我们还优化 了列:当列布局为空时,只需点击即可添加子组件,无需拖拽。可调整大小的组件现在也会显示实时 尺寸 ,让你能立即获得空间感知。

Canvas spots

视觉抛光与更佳图标

最后,我们通过界面进行了标准化和改进图标资产。布局更清晰,动作更直观,整体视觉反馈完美契合现代用户界面的期待。

准备好试试了吗? 点击这里获取最新版本

发布于 2026年6月11日
更新于 2026年7月28日
🔌 GJS.Market

在寻找 GrapesJS 插件吗?

超过 100 款精选插件、预设与模板 —— 由社区精挑细选并持续维护。

分享本文TwitterFacebookLinkedIn
发布平台
Blocomposer
Blocomposer
访问店铺 →

更多来自 Blocomposer

发现更多精彩文章,及时获取最新内容。

查看全部文章

来自 Blocomposer 的付费插件

由该作者精心打造的精选付费插件。

访问店铺 →