# Vue3使用hook 使用hook还是比较简单的，不看不知道，一看就明白。 ```ts // useSomeData.ts import { ref } from 'vue' // hook，入参可选 export const useSomeData = (initNum?: number) => { const data = ref(initNum || 0) // 声明数据 // 自增 setInterval(() => { data.value++ }, 1000); // 可选，暴露一个主动获取当前值的方法 function getDat
# vue路由切换时的动画效果 使用vue开发页面，经常有需求想要在切换页面时添加一个动画效果，尤其移动端，切换页面时，希望新页面能从右边覆盖过来，返回上一页时，又是前一页从左边覆盖过来。 这里vue的自带组件Transition来调一下。 技术栈：vue3 + ts 官方Transition文档：[https://cn.vuejs.org/guide/built-ins/transition](https://cn.vuejs.org/guide/built-ins/transition) **效果：** - 点击打开下一页时，新页面从右侧覆盖过来，原页面会向左偏移一些，最终被覆
# Svg转IconFont 这是一个提供给Vite作为编译工具时的一个工具，作用是在项目中放入Svg类型的文件，通过在这个工具，转为可以继承父组件的font-size、color等属性的类IconFont来使用。 支持vue和react，下面主要用vue来距离，会提供react时的代码。 主要原理时，在vite编译时，运行新写的脚本，去获取某个文件夹下的svg文件们，把他们的内容都写到页面的body中。 后面在开发时，要使用哪个图标，就使用固定的组件，传入name，name的值就是svg文件的名称。 有两个缺陷： - 目标文件夹下的svg文件们都会一次性加载到body下，不用时看