首先,确保你的项目已经使用 Vue 3 和支持 Vue 3 的构建工具(如 Vite 或 Vue CLI)搭建完毕。接下来,通过 npm 或 yarn 将 @voyage-x/hooks
添加到你的项目依赖中。
npm install @voyage-x/hooks
yarn add @voyage-x/hooks
@voyage-x/hooks
提供了一系列实用的 Vue 3 Composition API Hooks,旨在简化开发流程,提升代码可维护性。以下是一些核心 Hook 的使用演示:
此 Hook 组合了 Vue 3 的 onMounted
和 onActivated
生命周期钩子,使得逻辑既能在组件挂载时执行,也能在组件被激活时执行。
<script setup>
import { onMountedOrActivated } from '@voyage-x/hooks';
onMountedOrActivated(() => { console.log('组件已挂载或被激活'); });
</script>
方便地访问传递给组件的属性(Props)。
<script setup>
import { useAttrs } from '@voyage-x/hooks';
const attrs = useAttrs(); console.log(attrs);
</script>