• 请不要在回答技术问题时复制粘贴 AI 生成的内容
csdoker
V2EX  ›  程序员

用原生 JavaScript 写了一个组件库,欢迎各位大佬关注,吐槽~

  •  
  •   csdoker · Apr 9, 2020 · 3889 views
    This topic created in 2401 days ago, the information mentioned may be changed or developed.

    这个项目的名字我命名为 tiny-wheels,算是我这个前端菜鸡第一个正式的开源项目吧,顾名思义,就是一些比较简单、轻量的轮子,都是我平时工作中遇到的一些组件和效果,而这个开源项目的目的就是尝试用原生的方式把一些常见组件实现一下,这个项目虽然不大,但是我会非常用心的维护,欢迎大家给我提建议~

    配套的教程文章我会同步在我的个人网站、掘金、segmentfault 等平台更新

    25 replies  •  2020-04-20 18:06:36 +08:00
    zhw2590582
    zhw2590582
    Apr 9, 2020
    1
    建议加入 destroy 方法,也有利于解耦。
    csdoker
    csdoker
    OP
    Apr 9, 2020
    2
    @zhw2590582 请问你是指的组件本身还是组件中事件的销毁呢
    zhw2590582
    zhw2590582
    Apr 9, 2020
    3
    @csdoker 都要销毁
    u6pM63mMZ34z32cE
    u6pM63mMZ34z32cE
    Apr 9, 2020
    4
    一共 4 个组件, 我没看错?
    hewelzei
    hewelzei
    Apr 9, 2020
    5
    学习一下,已 star 。
    csdoker
    csdoker
    OP
    Apr 9, 2020 via iPhone
    6
    @mebtte 是的。。这个项目刚刚起步。。组件会慢慢添加的,,
    csdoker
    csdoker
    OP
    Apr 9, 2020 via iPhone
    7
    @hewelzei 谢谢~
    csdoker
    csdoker
    OP
    Apr 9, 2020 via iPhone
    8
    @zhw2590582 没懂你的意思呢,能说具体点吗,事件销毁是指 remove 事件监听吧,组件需要销毁吗?还是说你是指的组件的实例,这些内存浏览器不是会自动回收处理吗?请指教~
    zhw2590582
    zhw2590582
    Apr 9, 2020 via iPhone
    9
    @csdoker 销毁当然指事件和 dom 一起销毁
    csdoker
    csdoker
    OP
    Apr 9, 2020 via iPhone
    10
    @zhw2590582 嗯嗯,懂了
    csdoker
    csdoker
    OP
    Apr 9, 2020
    11
    @zhw2590582 你应该是指的 Pager 那个组件吧,每次 removeChild 后要把对应的 child 赋值为 null,这样应该就可以达到销毁的目的了
    NCry
    NCry
    Apr 9, 2020
    12
    分页控件想用用看,奈何需要考虑 IE 浏览器#24
    csdoker
    csdoker
    OP
    Apr 9, 2020
    13
    @NCry 0202 年了~该放弃 IE 了~哈哈
    csdoker
    csdoker
    OP
    Apr 9, 2020
    14
    @zhw2590582 我查了下相关的资料,现在大部分浏览器应该都会自动对移除掉的 dom 进行垃圾回收,所以没有额外引用的 dom 应该是可以不用手动清除的
    zhw2590582
    zhw2590582
    Apr 10, 2020
    15
    @csdoker dom 移除还不容易,直接 $el.innerHTML = ”“ 不就完了,问题是事件的移除,每个 addEventListener 都要有对应的 removeEventListener,事件绑定在 dom 上面,当 dom 移除了,事件其实还在的,只是 dom 移除而事件不移除就是所谓的内存泄漏。少年,你基本功不够啊。
    loveToMy1
    loveToMy1
    Apr 10, 2020
    16
    期待更多的组件
    duan602728596
    duan602728596
    Apr 10, 2020
    17
    @babel/polyfill 已经不推荐用了,建议 core-js 升级到 3,压缩插件用 terser
    basstk
    basstk
    Apr 10, 2020
    18
    支持一下,不错
    csdoker
    csdoker
    OP
    Apr 10, 2020
    19
    @zhw2590582 innerHTML 移除 dom,事件确实还在,用 removeChild 应该是没有这个问题的,浏览器会自动回收内存
    csdoker
    csdoker
    OP
    Apr 10, 2020
    20
    @duan602728596 暂时还没有引入 polyfill 因为没用太新的特性
    csdoker
    csdoker
    OP
    Apr 10, 2020
    21
    @duan602728596 你说的是 @babel/preset-env + @babel/plugin-transform-runtime 这套方案吧,,我修改了
    wuweijia
    wuweijia
    Apr 10, 2020
    22
    兄弟你这个翻页 体验是不是有点问题
    csdoker
    csdoker
    OP
    Apr 10, 2020 via iPhone
    23
    @wuweijia 有啥问题呢?
    alading11
    alading11
    Apr 20, 2020
    24
    老哥搜索考公相关的话题搜到了你的帖子,想请教下。老哥当初考了吗,情况如何
    csdoker
    csdoker
    OP
    Apr 20, 2020 via iPhone
    25
    @alading11 考了 没考上 放弃了 哈哈
    About   ·   Help   ·   Advertise   ·   Blog   ·   API   ·   FAQ   ·   Privacy   ·   Solana   ·   1362 Online   Highest 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 47ms · UTC 18:51 · PVG 02:51 · LAX 10:51 · JFK 13:51
    ♥ Do have faith in what you're doing.