步骤一:封装好要使用的工具类,记得要通过export default导出工具类中定义的方法,可以新建一个文件夹utils2,在该文件夹下创建ts文件 如:common.ts , 在common.ts 里面封装一个要使用工具。路径为src/utils2/common.ts
步骤二:在main.ts 中导入工具类
import untils from '@/untils2/common'
步骤三:在 main.ts 中将工具类挂载到vue的原型上
const setupAll = async () => {
const app = createApp(App)
app.config.globalProperties.$untils = untils
}
步骤四:在需要使用工具类的地方 进行引入,引入步骤如下
// Vue3组合式API写法中的 getCurrentInstance 函数可以创造一个vue实例
import { getCurrentInstance } from 'vue'
//这里从getCurrentInstance()获取到的组件实例中解构出proxy ,proxy可以访问到组件实例的属性或方法
const { proxy } = getCurrentInstance()
/**最后再从proxy中解构出$untils,此处能够结构出$untils,是因为我们在进行步骤二、三的时已经在main.ts中全局引入了$untils
*/
const { $untils } = proxy
步骤五:接下来就是使用$untils,通过 $untils.xxx 调用已经封装好多方法。