vue---定义全局变量或函数
开发项目的时候,有很多的东西需要重复使用,例如函数或者变量等,例如网站服务器地址,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---定义全局变量或函数的更多相关文章
- 在vue项目中 如何定义全局变量 全局函数
如题,在项目中,经常有些函数和变量是需要复用,比如说网站服务器地址,从后台拿到的:用户的登录token,用户的地址信息等,这时候就需要设置一波全局变量和全局函数 定义全局变量 原理: 设置一个专用的的 ...
- 在 Vuejs 项目中如何定义全局变量 全局函数
在 Vuejs 项目中如何定义全局变量 全局函数 在项目中,经常有些函数和变量是需要复用,比如说网站服务器地址,从后台拿到的:用户的登录 token, 用户的地址信息等,这时候就需要设置一波全局变量和 ...
- 【转】C++里定义全局变量和函数常用方法
http://blog.csdn.net/niying/article/details/637084 1:在头文件是声明变量,然后在使用的文件中用exten标识. ".h": in ...
- 多个".h"文件中声明及定义 全局变量和函数
一.".h"文件必须以如下格式书写 例:文件<CZ_efg_hi.h"> ------------文件内容----------- #ifndef CZ_Efg ...
- vue定义全局变量和全局方法
一.全局引入文件 1.先定义共用组件 common.vue <script type="text/javascript"> // 定义一些公共的属性和方法 const ...
- Vue 定义全局变量
main.js 中定义 import Ws from './lib/ws' import ElementUI from 'element-ui'; import GlobalFunc from './ ...
- vue定义全局变量
思路 将变量放到 window 对象上面 1.普通 创建 global.js window.a = 1; main.js 中引用 import './global.js' 实际使用 console.l ...
- vue 定义全局变量在一个组件内引用
第一步: 第二步: 第三步: ok!!完了,当然了,你也可以在 main.js里面全局引用,然后用原型链挂在vue上面,用this的方法去获取!!
- 全局变量 全局函数vue 方法
定义全局变量 原理: 设置一个专用的的全局变量模块文件,模块里面定义一些变量初始状态,用export default 暴露出去,在main.js里面使用Vue.prototype挂载到vue实例上面或 ...
- vue + typescript,定义全局变量或者方法
众所周知,在 vue中,如果想定义一个全局变量的方法很简单,直接在 vue的原型上挂载属性或者方法即可. 但是,加上了typescript之后, Vue.prototype.$xxx = xxx 这 ...
随机推荐
- idea中新增package总是嵌套的解决方法
在idea中创建package,为了方便会将com.xx.xx作为一个package,下面添加对应的子package.比如service,config等.但是当我创建是总是会嵌套在下面变成了com.x ...
- springboot socketio
pom.xml <?xml version="1.0" encoding="UTF-8"?> <project xmlns="htt ...
- 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 ...
- Codeforces B. Minimum Possible LCM(贪心数论)
题目描述: B. Minimum Possible LCM time limit per test 4 seconds memory limit per test 1024 megabytes inp ...
- 关于c++中的类型转换符
const_cast(链接) 用来去掉const或volatile属性 volatile: 用于并行设备的硬件寄存器(状态寄存器), 中断服务子程序中会访问到的非自动变量, 多线程中被几个任务共享的变 ...
- NPM——npm|cnpm如何升级
前言 手动更新了node.js版本后,想要升级下npm的版本 步骤 其实无论npm还是cnpm升级的命令都是一样的,除了需要指定包名. 升级npm $ npm install -g npm 查看npm ...
- ARDUNIO IMU processing姿态数据可视化
https://www.arduino.cn/thread-42852-1-1.html 关键数据打包 float roll, pitch, heading; Serial.print("O ...
- 使用gitstats分析git 仓库代码
gitstats 是一个很不错的git 代码提交分析工具,可以帮助我们生成图表统计结果 工具文档信息 gitstats http://gitstats.sourceforge.net/ 安装 使用ce ...
- 28-ESP8266 SDK开发基础入门篇--编写wifi模块TCP 客户端程序(官方API版,非RTOS版)
https://www.cnblogs.com/yangfengwu/p/11432795.html 注:这节实现的功能是WIFI模块作为TCP 客户端,连接咱的TCP服务器,然后实现透传 本来想着做 ...
- SpringBoot导入Excel数据到MySQL数据库
package com.example.example1.Controller; import com.example.example1.Entity.User; import com.example ...