JSPM

  • Created
  • Published
  • Downloads 396
  • Score
    100M100P100Q83515F
  • License MIT

js-tool

Package Exports

  • lazy-js-utils
  • lazy-js-utils/dist/index.cjs
  • lazy-js-utils/dist/index.js

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (lazy-js-utils) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

lazy-js-utils

NPM version NPM version NPM version

🖥 文档

English | 简体中文

目前整理了200 左右的常用函数,还在持续更新中...,你的认可是对我最大的鼓励 ♥️

💯 亮点

  • 纯 js 的工具函数,可使用在任何可执行 js 的环境
  • 大量减少ref<HTMLElment>onMounted的使用,可以 script 标签直接调用
  • 所有的副作用函数都能返回一个 stop 函数,可以在任意地方停止事件的执行,并且在页面销毁时自动销毁事件
  • api 设计简单、实用、类型友好

✋ 例子

import {
  insertElement,
  useAnimationFrame,
  useEventListener,
  useMutationObserver,
} from 'lazy-js-utils'
// 监听container的变化, 你不在需要const container = ref<HTMLElement>
useMutationObserver('#container', (mutationsList, observer) => {
  console.log(mutationsList)
})
// requestAnimationFrame
useAnimationFrame(
  (timestamp) => {
    // 每针相隔1s执行
    console.log('animationFrame', timestamp)
  },
  1000,
  true /* 只执行一次后被销毁 */,
)
// 注册事件
useEventListener('#container', 'click', () => {
  console.log('click')
})
// 插入元素
insertElement('#container', '.content')
// 删除元素
removeElement('.content')
<div id="container"></div>
<div class="content">hello world</div>

📖 使用说明

npm i lazy-js-utils # 安装

import {
  deepCompare
 } from 'lazy-js-utils' # 按需引入

👉 文档

请我喝一杯咖啡

License

MIT

GitHub 地址

欢迎 PR