宫格导航组件

宫格导航组件用于展示一组图标或文字入口，适合商品分类、活动入口和常用功能导航。

添加组件

1. 在页面编辑器中拖入【宫格导航】组件；
2. 选择展示图文、仅图片或仅文本；
3. 设置每行显示 3、4 或 5 个；
4. 选择固定展示或滑动展示；
5. 添加导航项，配置图标、标题和点击动作；
6. 调整图标大小、字号和圆角；
7. 保存后逐项测试。

滑动展示

选择【滑动】后，可以继续设置显示行数以及线形或点形指示器。导航项超过当前页容量时，用户可以横向切换查看。

配置说明

配置项	说明
展示内容	图文、仅图片或仅文本
每行个数	每行显示 3、4 或 5 个入口
展示方式	固定展示全部内容，或按页横向滑动
显示行数	仅滑动展示时生效，决定每页容量
指示器样式	仅滑动展示时生效，支持线或点
宫格内容	配置图标、标题和可选点击动作
内容样式	调整图标大小、文字大小、图标圆角和指示器色调

滑动模式每页容量等于【每行个数 × 显示行数】。内容没有超过一页时，指示器不会形成切换效果。

使用建议

• 同一组图标保持尺寸和设计风格一致；
• 标题保持简短，避免在小屏幕中换行；
• 仅图片模式下，图片本身应能说明入口用途；
• 固定展示时控制导航项数量，避免页面过长；
• 滑动展示时检查最后一页和指示器状态；
• 发布前确认每个点击动作都指向正确目标。

常见问题

为什么没有显示滑动指示器？

请确认展示方式为【滑动】，且导航项数量超过当前页容量。

只显示文字时为什么不能设置图标大小？

仅文本模式不会渲染图标，对应图片尺寸和圆角配置会自动隐藏。