hzero-overview

name	hzero-overview
description	HZero 框架开发指南与 HZero 组件使用说明

前端工程目录结构

目录结构主要和使用的脚手架有关，具体可以参考 hzero-cli 和 hzerojs。

src 主要源码文件目录

packages 目录

在 packages 下面开发新服务（模块）。

注意： 请勿在根目录下的 src 下进行新功能开发。

hzero-front-XXX 目录

子模块（命名根据实际需求）。

目录名	说明
assets	公共 icons 资源
components	通用组件
config/routers	页面路由配置
customize	跨模块组件，如：卡片开发（hzerojs 可以配置到子模块的配置文件）
models	Model 组件
routes	所有路由组件
services	所有服务组件
stores	DataSet：采用猪齿鱼 UI 开发使用 DataSet
utils	通用工具类

assets 目录

存放全局的资源文件，例如字体、图片。

customize 目录

跨模块组件，hzerojs 可以配置到子模块的配置文件。

components 目录

组件目录，所有 UI 组件代码。每一个组件单独一个目录文件，命名规则采用帕斯卡命名法。

例如：单选按钮 → CheckBox

config/routers 目录

配置菜单路由，新版 cli 的路由配置和老版本有所不同，需要采用 import 方式。

models 目录（使用 c7n-pro 可不关注此层）

所有 model 按照功能命名，model 命名采用驼峰。

routes 目录

存放所有界面组件。目录结构采用 [功能模块]/具体组件：

• 功能模块：采用帕斯卡命名法
• 组件：采用帕斯卡命名法

services 目录

所有 model 中调用的服务逻辑代码。目录结构采用服务组件：

• 服务组件：采用驼峰结构，例如 xxxService

utils 目录

常用工具类。

参考文档

所有详细文档放在 references/ 目录下，按需查阅。

HZero 核心概念

• HZero 基础概念（多语言/权限/菜单/路由）references/hzero-concepts.md

HZero UI 组件

• 组件总览 references/hzero-components.md — 全部组件索引
• 按钮 references/hzero-button.md
• 输入框 / 数字输入 references/hzero-input.md
• 下拉选择 references/hzero-select.md
• 日期选择 / 时间选择 references/hzero-datepicker.md
• 表单 references/hzero-form.md
• 表格 references/hzero-table.md
• 标签页 references/hzero-tabs.md
• 卡片 references/hzero-card.md
• 模态对话框 references/hzero-modal.md
• 文件上传 references/hzero-upload.md
• 栅格 references/hzero-grid.md
• 布局 references/hzero-layout.md
• 导航菜单 references/hzero-menu.md
• 下拉菜单 references/hzero-dropdown.md
• 分页 references/hzero-pagination.md
• 面包屑 references/hzero-breadcrumb.md
• 步骤条 references/hzero-steps.md
• 固钉 references/hzero-affix.md
• 多选框 references/hzero-checkbox.md
• 单选框 references/hzero-radio.md
• 开关 references/hzero-switch.md
• 级联选择 references/hzero-cascader.md
• 自动完成 references/hzero-auto-complete.md
• 评分 references/hzero-rate.md
• 树选择 references/hzero-tree-select.md
• 穿梭框 references/hzero-transfer.md
• 标签 references/hzero-tag.md
• 徽标数 references/hzero-badge.md
• 树形控件 references/hzero-tree.md
• 折叠面板 references/hzero-collapse.md
• 气泡卡片 references/hzero-popover.md
• 文字提示 references/hzero-tooltip.md
• 头像 references/hzero-avatar.md
• 列表 references/hzero-list.md
• 走马灯 references/hzero-carousel.md
• 日历 references/hzero-calendar.md
• 时间轴 references/hzero-timeline.md
• 警告提示 references/hzero-alert.md
• 抽屉 references/hzero-drawer.md
• 全局提示 references/hzero-message.md
• 通知提醒框 references/hzero-notification.md
• 进度条 references/hzero-progress.md
• 气泡确认框 references/hzero-popconfirm.md
• 加载中 references/hzero-spin.md
• 全局化配置 references/hzero-config-provider.md
• 分割线 references/hzero-divider.md
• 锚点 references/hzero-anchor.md
• 回到顶部 references/hzero-back-top.md