组件结构模型

了解组件体验设计的部分原则，有利于提升使用效率。

一处导入，处处可用

在高度模块化的项目中，通常我们引入其他组件库，需要在每一个使用组件的模块进行import组件进行具名导入。axue不需要这么麻烦，只需要import一次。

推荐的做法，在你的项目入口模块处，进行先行导入。

import {init} from  "axue"
init()

接下来，你可以到其他js模块任意使用标签，或者html文件内任意使用

一、标签命名

axue提供的组件，在命名上是有规律的。

1、前缀拼接

文档标题更加简洁，标签名统一省略了axue-前缀，实际使用时需要带上。

如logo-close{顶条}，在实际使用时，对应的默认标签名是<axue-logo-close>。之所以说是默认，因为框架提供了自定义标签的能力，你可以按自己的偏好，统一自定义前缀，也可以单独修改该组件的标签名称。

2、命名规律

没有绝对明确的命名规范，但为了最大程度的体现结构和用途，总体会遵循了一定通用原则，如：

• [轴延原则] 用-x代表横轴、-y代表纵轴，-s代表多层嵌套，-2代表最高2层嵌套

• [关系原则] 中杠-代表平级，底杠_代表嵌套

• [材料原则] 尽量以组成元素分段命名

• [象形原则] 部分以通俗用途含义命名
• [直觉原则] 有时不遵循以上教条没有，往往是认为更符合直觉顺延

二、组件域的层级架构

axue提供的组件，在架构上也是有规律的。

就层级模型而言，所有的内置域组件一定不依赖基础域或容器域，涉及到模态容器等等，目前是直接进行业务实现。比如你错误的使用了原子域组件，并没有弹框提示能力，因为原子域严格不依赖上层能力，而基础域择有。