Extag

Extag是一个事件驱动和基于组件的JavaScript库，用于构建Web用户界面。Extag提供了一个由文本、元素、片段和组件构成的Shell层。其中，组件支持模板、数据绑定等，具有良好的可扩展性，能够更好地组织用户界面，管理数据状态。通过监听和派发自定义属性更改事件，内嵌在组件模板中的数据绑定表达式得以生效，从而能够动态地改变Shell层的内容。Shell层一旦发生变化，Extag就会通过ExtagDOM以异步批量的模式，将变化的部分渲染到真实的DOM层。

快速开始

使用script标签简单地引入Extag和ExtagDOM。Extag会通过ExtagDOM来进行DOM操作。

<script src="https://unpkg.com/extag/dist/extag.js"></script>

<script src="https://unpkg.com/extag-dom/dist/extag-dom.js"></script>

也可通过npm安装，使用ES6 Module的import，或CommonJS的require，导入Extag和ExtagDOM后，应当将Extag的视图引擎配置为ExtagDOM，

npm install extag

npm install extag-dom

import Extag from "extag"

import ExtagDOM from "extag-dom"

Extag.conf("view-engine", ExtagDOM);

一个简单的Extag例子如下：

我们定义了一个Hello类，继承自Component。组件模板中使用了一个单向的数据绑定表达式@{ name }。包裹在@{ }内的自定义的特性name是可绑定的，它的默认值为'World'。创建一个Hello类的实例，附着到页面上的一个元素上，'Hello, World!'的字样就会渲染到页面上。

在CodePen上尝试