开发项目的时候,有很多的东西需要重复使用,例如函数或者变量等,例如网站服务器地址,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. idea中新增package总是嵌套的解决方法

    在idea中创建package,为了方便会将com.xx.xx作为一个package,下面添加对应的子package.比如service,config等.但是当我创建是总是会嵌套在下面变成了com.x ...

  2. springboot socketio

    pom.xml <?xml version="1.0" encoding="UTF-8"?> <project xmlns="htt ...

  3. Manthan, Codefest 19 (open for everyone, rated, Div. 1 + Div. 2)-D. Restore Permutation-构造+树状数组

    Manthan, Codefest 19 (open for everyone, rated, Div. 1 + Div. 2)-D. Restore Permutation-构造+树状数组 [Pro ...

  4. Codeforces B. Minimum Possible LCM(贪心数论)

    题目描述: B. Minimum Possible LCM time limit per test 4 seconds memory limit per test 1024 megabytes inp ...

  5. 关于c++中的类型转换符

    const_cast(链接) 用来去掉const或volatile属性 volatile: 用于并行设备的硬件寄存器(状态寄存器), 中断服务子程序中会访问到的非自动变量, 多线程中被几个任务共享的变 ...

  6. NPM——npm|cnpm如何升级

    前言 手动更新了node.js版本后,想要升级下npm的版本 步骤 其实无论npm还是cnpm升级的命令都是一样的,除了需要指定包名. 升级npm $ npm install -g npm 查看npm ...

  7. ARDUNIO IMU processing姿态数据可视化

    https://www.arduino.cn/thread-42852-1-1.html 关键数据打包 float roll, pitch, heading; Serial.print("O ...

  8. 使用gitstats分析git 仓库代码

    gitstats 是一个很不错的git 代码提交分析工具,可以帮助我们生成图表统计结果 工具文档信息 gitstats http://gitstats.sourceforge.net/ 安装 使用ce ...

  9. 28-ESP8266 SDK开发基础入门篇--编写wifi模块TCP 客户端程序(官方API版,非RTOS版)

    https://www.cnblogs.com/yangfengwu/p/11432795.html 注:这节实现的功能是WIFI模块作为TCP 客户端,连接咱的TCP服务器,然后实现透传 本来想着做 ...

  10. SpringBoot导入Excel数据到MySQL数据库

    package com.example.example1.Controller; import com.example.example1.Entity.User; import com.example ...