共计 923 个字符，预计需要花费 3 分钟才能阅读完成。
常识付费应用 script 标签引入 Vue.js。在我的项目中也能够应用组件，实现一些公共业务。以 H5 登录弹窗为例，对在常识付费中应用组件进行阐明。
登录弹窗会在多个业务场景下应用，如果在每个业务场景下反复一套登录弹窗，会使得代码冗余，且前期保护较为繁琐。此时，咱们能够将登陆业务的代码剥离进去，在须要对其应用的中央进行引入即可。这样做不仅精简代码，而且在前期保护时也更加容易，不用再为新的性能需要，在多处进行代码改变。
在以后我的项目下，有两种剥离形式。一种形式是将登录业务代码写在独立的 JavaScript 文件中，其中的 DOM 片段须要进行字符串拼接；另一种形式是应用插件，将写有 DOM 片段的 HTML 文件、JavaScript 文件、CSS 文件进行组合。
拼接字符串形式：
在晚期我的项目中，应用的就是这种形式。
如上图所示，图中的模板内容应用字符串拼接而成。这种形式拼接字符串一旦超多，会显得代码很乱，且易出错。
组合形式：
我的项目应用 RequireJS 进行模块化开发，所以咱们能够应用 text.js 和 css.js 插件，引入 HTML 和 CSS。
如上图所示，咱们将登录组件的 HTML、CSS 和 JavaScript 文件放在 base_login 文件夹下。
如上图所示，base_login 文件夹下的文件。
如上图所示，这是 index.html 中的内容。
如上图所示，这是 index.css 中的内容。
如上图所示，这是 index.js 中的内容，其中引入 index.html 和 index.css 文件。
如上图所示，在页面中应用登录组件，先引入，再应用。
如上图所示，这是组件的应用。
源码附件曾经打包好上传到百度云了，大家自行下载即可～
链接: https://pan.baidu.com/s/14G-b…
提取码: yu27
百度云链接不稳固，随时可能会生效，大家放松保留哈。
如果百度云链接生效了的话，请留言通知我，我看到后会及时更新～
开源地址
码云地址：
http://github.crmeb.net/u/defu
Github 地址：
http://github.crmeb.net/u/defu
开源不易，Star 以表尊重，感兴趣的敌人欢送 Star，提交 PR，一起保护开源我的项目，造福更多人！