[聚合文章] 一个行为标准Popup组件(vue), 强大的过度动画支持

Vue.js 2017-11-27 17 阅读

之前看过很多的组件库, 但是它们的Popup行为和原生的界面差别不大, 但是行为上面却各种小细节不足, 所以有了这个强调 行为标准 的popup组件

特点

  1. 支持 返回键 , 可以按浏览器返回按钮关闭popup
  2. 可以写出小复杂的 过度动画 , 比如磁贴按压效果[在popUpMenu可看到]
  3. 支持css动画库, 比如animation.css, 使用的时候自行添加依赖就好了
  4. 提供了几个比较好的popup组件, calendar, picker, imgViewer
  5. 行为定义相对标准 , 这一点比较重要的, 前端行为定义犹如算法的输入定义一样, 比如触发关闭之后, 结束动画未结束之前, popup会拦截输入事件, popup属于 不可交互状态
  6. 拓展比较方便~, 之后会补充popup编写的教程~
  7. 差点忘说了, 强大的 定位支持 , 有 居中 , clickRelative , domRelative , 其中 domRelative 支持25个位置
  8. Layer 都经过优化了, 层次合理~, 没有出现压缩层, 或者层爆栈的情况
  9. 采用的是 绝对的置顶策略 , 就是即便在页面内设置 fixed + z-index:99999999999; , 都不会遮盖弹出的 popup

注:本文内容来自互联网,旨在为开发者提供分享、交流的平台。如有涉及文章版权等事宜,请你联系站长进行处理。