开发项目的时候,有很多的东西需要重复使用,例如函数或者变量等,例如网站服务器地址,token等,这时候就需要设置一波全局变量和全局函数

定义全局函数

原理

新建一个模块文件,然后在main.js里面通过Vue.prototype将函数挂载到Vue实例上面,通过this.函数名,来运行函数。

1. 在main.js里面直接写函数

简单的函数可以直接在main.js里面直接写

Vue.prototype.changeData = function (){//changeData是函数名
alert('执行成功');
}

组件中调用:

this.changeData();//直接通过this运行函数

2. 写一个模块文件,挂载到main.js上面。

base.js文件,文件位置可以放在跟main.js同一级,方便引用

exports.install = function (Vue, options) {
Vue.prototype.text1 = function (){//全局函数1
alert('执行成功1');
};
Vue.prototype.text2 = function (){//全局函数2
alert('执行成功2');
};
};

main.js入口文件:

import base from './base'//引用
Vue.use(base);//将全局函数当做插件来进行注册

具体使用:

this.text1();
this.text2();

vue---定义全局变量或函数的更多相关文章

  1. 在vue项目中 如何定义全局变量 全局函数

    如题,在项目中,经常有些函数和变量是需要复用,比如说网站服务器地址,从后台拿到的:用户的登录token,用户的地址信息等,这时候就需要设置一波全局变量和全局函数 定义全局变量 原理: 设置一个专用的的 ...

  2. 在 Vuejs 项目中如何定义全局变量 全局函数

    在 Vuejs 项目中如何定义全局变量 全局函数 在项目中,经常有些函数和变量是需要复用,比如说网站服务器地址,从后台拿到的:用户的登录 token, 用户的地址信息等,这时候就需要设置一波全局变量和 ...

  3. 【转】C++里定义全局变量和函数常用方法

    http://blog.csdn.net/niying/article/details/637084 1:在头文件是声明变量,然后在使用的文件中用exten标识. ".h": in ...

  4. 多个".h"文件中声明及定义 全局变量和函数

    一.".h"文件必须以如下格式书写 例:文件<CZ_efg_hi.h"> ------------文件内容----------- #ifndef CZ_Efg ...

  5. vue定义全局变量和全局方法

    一.全局引入文件 1.先定义共用组件 common.vue <script type="text/javascript"> // 定义一些公共的属性和方法 const ...

  6. Vue 定义全局变量

    main.js 中定义 import Ws from './lib/ws' import ElementUI from 'element-ui'; import GlobalFunc from './ ...

  7. vue定义全局变量

    思路 将变量放到 window 对象上面 1.普通 创建 global.js window.a = 1; main.js 中引用 import './global.js' 实际使用 console.l ...

  8. vue 定义全局变量在一个组件内引用

    第一步: 第二步: 第三步: ok!!完了,当然了,你也可以在 main.js里面全局引用,然后用原型链挂在vue上面,用this的方法去获取!!

  9. 全局变量 全局函数vue 方法

    定义全局变量 原理: 设置一个专用的的全局变量模块文件,模块里面定义一些变量初始状态,用export default 暴露出去,在main.js里面使用Vue.prototype挂载到vue实例上面或 ...

  10. vue + typescript,定义全局变量或者方法

    众所周知,在 vue中,如果想定义一个全局变量的方法很简单,直接在 vue的原型上挂载属性或者方法即可. 但是,加上了typescript之后, Vue.prototype.$xxx = xxx  这 ...

随机推荐

  1. 关于 Spring AOP (AspectJ) 你该知晓的一切

    版权声明:本文为CSDN博主「zejian_」的原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接及本声明.原文链接:https://blog.csdn.net/javazej ...

  2. Docker02-重要概念

    目录 Docker简介 思考 Docker是什么 Docker 解决了什么问题 Docker 的优点 Docker的目的 Docker常用场景 虚拟化和Docker的对比 Docker的架构 Dock ...

  3. Linux命令——chgrp、chown、chmod

    简介 这三个命令都用于更改文件permission(权限).即下图红框位置 除此之外还有个“连结”,那个指的是硬链接,不是软连接.FS使用inode区分不同文件,而目录树使用文件名区分不同文件,因此可 ...

  4. Python入门篇-数据结构树(tree)的遍历

    Python入门篇-数据结构树(tree)的遍历 作者:尹正杰 版权声明:原创作品,谢绝转载!否则将追究法律责任. 一.遍历 迭代所有元素一遍. 二.树的遍历 对树中所有元素不重复地访问一遍,也称作扫 ...

  5. X.509_2

    参考:你了解HTTPS,但你可能不了解X.509 地址:http://www.imooc.com/article/288067?block_id=tuijian_wz 参考:X.509证书的解析.验证 ...

  6. python测试开发django-rest-framework-59.restful接口开发

    前言 REST 不是什么具体的软件或者代码,而是一种思想.现在流行前后端分离开发项目,一般用 json 来交换数据. 相信写过模板的同学都知道,只要哪怕页面中的数据有一丝丝变动,那整个页面都需要重新渲 ...

  7. 微信小程序~设置tabBar后,wx.navigateTo不能跳转

    当wx.navigateTo跳转链接跟app.json中设置的tabbar中跳转链接一样时,wx.navigateTo就不能跳转可以改为wx.switchTab 1.当app.json中设置了tabb ...

  8. 手写二叉树-先序构造(泛型)-层序遍历(Java版)

    如题 先序构造 数据类型使用了泛型,在后续的更改中,更换数据类型只需要少许的变更代码 层序遍历 利用Node类的level属性 所有属性的权限全为public ,为了方便先这么写吧,建议还是用priv ...

  9. Dict.Count

    static void Main(string[] args) { Dictionary<string, string> paraNameValueDict = new Dictionar ...

  10. yolov1详细讲解

    前言 当我们谈起计算机视觉时,首先想到的就是图像分类,没错,图像分类是计算机视觉最基本的任务之一,但是在图像分类的基础上,还有更复杂和有意思的任务,如目标检测,物体定位,图像分割等,见图1所示.其中目 ...