uni-app+vue3 封装全局函数（方法）

前言

当我们在uniapp+vue3开发中需要使用一些重复性较高的方法时，可以通过封装全局方法来提高代码的复用性和可维护性。下面我将为大家介绍如何在uniapp+vue3中封装全局方法。

正文开始

1. 创建utils文件夹

首先，在src目录下新建一个utils文件夹，用于存放全局方法的封装代码。

2. 创建globalMethods.js文件

在utils文件夹下新建一个globalMethods.js文件，用于存放全局方法的具体实现代码。在globalMethods.js中定义您需要封装的全局方法，例如：

function showToast(message) {
  uni.showToast({
    title: message,
    icon: 'none'
  })
}

function redirectTo(url) {
  uni.redirectTo({
    url: url
  })
}

export default {
  showToast,
  redirectTo
}

3. 挂载全局方法

在main.js中引入globalMethods.js，并将其挂载到Vue的原型上，使其成为全局方法：

import globalMethods from '@/utils/globalMethods.js'
Vue.prototype.$globalMethods = globalMethods

4. 使用全局方法

然后您就可以在项目中的任何地方使用这些全局方法了，例如：

this.$globalMethods.showToast('Hello World')
this.$globalMethods.redirectTo('/pages/index/index')

通过封装全局方法，我们可以避免在每个组件中都写一遍相同的代码，提高代码的复用性和可维护性。同时，我们也可以根据自己的需求来封装其他常用的全局方法，使得开发更加高效和便捷。