笔记大全

uniapp写公共方法的地方

更新时间：2023-07-13

在UniApp中，我们可以在多个地方去写公共方法，以供全局调用。下面将介绍四个常用的地方。 1. util.js文件中编写公共方法在UniApp中，我们通常会创建一个util.js文件来编写公共方法，例如日期格式化、字符串截取等等。在该文件中，我们可以通过exports将公共方法暴露出去供其他文件使用。 ```html

util.js文件中编写公共方法

// util.js

// 日期格式化
export function formatDate(date, format) {
  // code
}

// 字符串截取
export function truncateString(str, length) {
  // code
}

// 其他公共方法...

上面的代码演示了在util.js文件中编写日期格式化和字符串截取的公共方法。在其他文件中，我们可以通过import语句引入这些公共方法并使用。

2. 在全局组件中编写公共方法 UniApp中可以创建全局组件，这些组件可以在任意页面中使用。通过在全局组件中编写公共方法，可以在任意页面中调用这些方法。 ```html

全局组件中编写公共方法

// global-components/my-component.vue

在上面的代码中，我们在全局组件my-component.vue中定义了两个全局方法globalMethod1和globalMethod2。这些方法可以在任意页面的组件中，通过$refs或者通过事件调用进行使用。

3. 在main.js中编写公共方法在UniApp中，main.js是应用程序的入口文件，我们可以在该文件中编写公共方法。这些方法将在应用程序启动时被加载，并可以在整个应用程序中使用。 ```html

在main.js中编写公共方法

// main.js

// 全局方法1
Vue.prototype.globalMethod1 = function() {
  // code
}

// 全局方法2
Vue.prototype.globalMethod2 = function() {
  // code
}

// 其他公共方法...

上面的代码演示了在main.js中编写两个全局方法globalMethod1和globalMethod2。这些方法可以在应用程序的任何组件中通过this调用。

4. 在uni-icons中编写公共方法 UniIcons是UniApp官方提供的一套图标库组件，我们可以扩展这个组件，并在扩展中编写公共方法。这样，我们可以在应用程序的任何页面中引入图标和公共方法。 ```html

在uni-icons中编写公共方法

// uni-icons-extend.js

import UniIcons from '@/components/uni-icons/uni-icons.vue'

UniIcons.props.methods.myMethod = function() {
  // code
}

export default UniIcons

在上面的代码中，我们通过扩展UniIcons组件的props.methods属性，添加了一个名为myMethod的公共方法。然后将这个扩展后的组件export出去，在使用时引入即可。

综上所述，我们可以在util.js文件、全局组件、main.js和uni-icons中分别编写公共方法。通过这些方法，我们可以在整个应用程序中进行调用，提高代码的重用性和开发效率。

c语言编程笔录