Vue2使用全局函数或变量的两种常用方式

简介: 这篇文章介绍了在Vue 2项目中实现全局函数或变量的两种常用方式:一种是通过挂载到Vue的`prototype`,另一种是使用Vue的全局混入(Vue.mixin)。

①在index.js中创建getAction函数,并全局使用:

export function getAction (url, parameter) {

  return request({

    url: url,

    method: 'get',

    params: parameter

  })

}

②创建globalUse.js:

  • 方式一挂载到Vue**.prototype**:
import { getAction } from './index'

import Vue from 'vue'

Vue.getAction = getAction // 使用时需先引入Vue,然后调用:Vue.getAction

Vue.prototype.$getAction = getAction // 使用:this.$getAction
  • 方式二使用全局混入Vue.mixin**:**
import { getAction } from './index'

Vue.mixin({ data () { return { getAction } } }) // 全局混入到data中,使用:this.getAction

// Vue.mixin({ methods: { getAction } }) // 全局混入到methods中,使用:this.getAction

③在main.js中引入globalUse:

import Vue from 'vue'

import App from './App.vue'

import './utils/globalUse'

new Vue({

  render: h => h(App)

}).$mount('#app')
相关文章
|
JavaScript
【JS用法】js判断字符串是否包含某个字符串
【JS用法】js判断字符串是否包含某个字符串
1052 0
|
存储 JavaScript 前端开发
如何高效实现 vue 文件批量下载及相关操作技巧
在Vue项目中,实现文件批量下载是常见需求。例如文档管理系统或图片库应用中,用户可能需要一次性下载多个文件。本文介绍了三种技术方案:1) 使用`file-saver`和`jszip`插件在前端打包文件为ZIP并下载;2) 借助后端接口完成文件压缩与传输;3) 使用`StreamSaver`解决大文件下载问题。同时,通过在线教育平台的实例详细说明了前后端的具体实现步骤,帮助开发者根据项目需求选择合适方案。
1048 0
|
存储 JavaScript
vue项目中定义全局变量、函数的几种方法
vue项目中定义全局变量、函数的几种方法
768 1
|
iOS开发 开发者 Windows
uniapp云打包ios应用证书的获取方法,生成指南
打包用到的一共两个文件,一个是p12格式的私钥证书,一个是证书profile文件。其中生成p12证书的时候,按照官网的教程,是需要MAC电脑来协助做的,主要是生成一些csr文件和导出p12证书等。其实这些步骤也可以借助一些其他的工具来实现,不一定使用mac电脑,用windows电脑也可以创建。
1568 0
|
JavaScript
Vue3使用全局函数或变量的两种常用方式
这篇文章介绍了Vue 3中实现全局函数或变量的两种方法:一种是使用`provide/inject`进行依赖注入,另一种是利用`app.config.globalProperties`和`getCurrentInstance()`来注册全局属性。
2360 2
Vue3使用全局函数或变量的两种常用方式
|
缓存 移动开发 JavaScript
《vue2进阶篇:路由》第10章:vue-router,包括基础路由、嵌套路由、路由的query参数和params参数、命名路由、router-link的replace属性、编程式路由、缓存路由组件
《vue2进阶篇:路由》第10章:vue-router,包括基础路由、嵌套路由、路由的query参数和params参数、命名路由、router-link的replace属性、编程式路由、缓存路由组件
799 2
|
JavaScript
vue组件封装 | 数字输入框(限制只能输入数字的input,可以指定小数点位数,最大值、最小值)
vue组件封装 | 数字输入框(限制只能输入数字的input,可以指定小数点位数,最大值、最小值)
825 7
|
JavaScript 小程序 开发者
uni-app开发实战:利用Vue混入(mixin)实现微信小程序全局分享功能,一键发送给朋友、分享到朋友圈、复制链接
uni-app开发实战:利用Vue混入(mixin)实现微信小程序全局分享功能,一键发送给朋友、分享到朋友圈、复制链接
3539 0
|
JavaScript
vite-plugin-html的使用及实现
【8月更文挑战第4天】vite-plugin-html的使用及实现(实现一个简易版的插件)
1802 4