Reader

基于 Custom Elements 的组件化开发

2018-09-17 00:00:00 +0000 UTC | vivaxy's Blog | 博客

customElements 是 Web Components 规范下的新 API，可以用来实现组件化开发。 如果你的应用只用兼容最新的 Chrome 浏览器，那么用它来替代 React 或者 Vue 是一个不错的选择。 基本用法 组件声明在一个 HTML 文件中。组件包括样式（Style），节点（DOM）和交互逻辑（Script）。一个组件文件的基本结构如下： <template> <style></style> <div>DOM 节点</div> </template> <script> const componentDocument = document.currentScript.ownerDocument; class Component extends HTMLElement { static get TAG_NAME() { return 'component-tag-name'; }; constructor() { super(); const shadow = this.attachShadow({ mode: 'closed' }); const...