VueUse
made with Vuejs

VueUse

这是一个Vue Composition API实用程序的集合。

相关问答
暂无相关问题
查看全部
简介及使用教程

VueUse是一个Vue Composition API实用程序的集合,适用于Vue 2.x和3.x。

受React使用的启发,VueUse旨在提供一种快速而干净的方式来使用Vue Composition API。

当前VueUse包含1个核心库及5个扩展库,共有140+Function。

特点

  • 支持按需引入
  • 使用Typescript开发
  • 无缝迁移:同时指出Vue2和Vue3
  • 弹性:可配置事件过滤
  • 无需打包:支持CDN使用
  • SSR友好
  • 交互式文档与演示
  • 可选扩展:Router、Firebase、 RxJS等

安装

Npm

npm i @vueuse/core

Yarn

yarn add @vueuse/core

浏览器

<script src="https://unpkg.com/@vueuse/core"></script>

使用

import { useMouse, usePreferredDark, useLocalStorage } from '@vueuse/core'

export default {
  setup() {
    // tracks mouse position
    const { x, y } = useMouse()

    // is user prefers dark theme
    const isDark = usePreferredDark()

    // persist state in localStorage
    const store = useLocalStorage(
      'my-storage', 
      {
        name: 'Apple',
        color: 'red',
      },
    )

    return { x, y, isDark, store }
  }
})

image.png

作者

Anthony Fu

@antfu7

相关项目

这是一个支持“查看源码”的Vue指令。
这是一个图片显示视差指令。
这是一个Vue.js的简单事件处理插件。
这是一个用于在组件外部呈现DOM的Portal组件。
这是一个基于模板的验证框架。
这是一个让你可以开发同时支持Vue2和3的通用Vue库的开发工具。