模块化之后,想用js全局变量,遇到点困难。搜索资料后搞定,大概2个步骤:

1、定义一个vue模块,const定义变量,并用export对外暴露.

Globle.vue

<script>
// 服务端url
const SERVER_BASE_URL = 'http://10.199.xxx.x0:8081/'
export default{
SERVER_BASE_URL
}
</script>

2、在用到全局变量的模块,import后再使用

test.vue

import global_ from 'components/common/Global.vue'
console.log(global_.SERVER_BASE_URL)

------------------------------2018/12/27 定义component.js并在main.js中引用----------------------------

1. 定义并暴露

import Vue from 'vue';

let MyComm = new Vue({
methods: {
deleteCookie: function (cname) {
let d = new Date();
let expires = "expires=" + d.toGMTString();
document.cookie = cname + "=; " + expires;
}, getCookie: function (cname) {
let name = cname + "=";
let ca = document.cookie.split(';');
for (let i = 0; i < ca.length; i++) {
let c = ca[i].trim();
if (c.indexOf(name) == 0) return c.substring(name.length, c.length);
}
return "";
}, setCookie: function (cname, cvalue, exdays) {
let d = new Date();
d.setTime(d.getTime() + (exdays * 24 * 60 * 60 * 1000));
let expires = "expires=" + d.toGMTString();
document.cookie = cname + "=" + cvalue + "; " + expires;
}
}
}) export default MyComm;

2. main.js中引用

import MyComm from "./components/common/comm";

const role = MyComm.getCookie('ms_username')

VUE.js全局变量的定义的更多相关文章

  1. VUE中全局变量的定义和使用

    目录 VUE中全局变量的定义和使用 1.工作中遇到的两类问题 1.1 状态值(标志) 1.2 传递字段 2.解决方法 2.1 VUEX 2.2 使用全局变量法管理状态与字段值 3.具体实现 3.1创建 ...

  2. Vue.js先入个门看看

    使用vue.js原文介绍:Vue.js是一个构建数据驱动的web界面库.Vue.js的目标是通过尽可能简单的API实现响应式数据绑定和组合的视图组件.vue.js上手非常简单,先看看几个例子: 例一: ...

  3. 第4章-Vue.js 交互及实例的生命周期

    一.学习目标 了解实例生命周期的过程 理解钩子函数的作用 掌握Vue.js过滤器的使用方法 (重点) 能够使用网络请求进行前后端交互 (重点.难点) 二.交互的基本概念 2.1.前端和后端的概念 说明 ...

  4. vue.js原生组件化开发(一)——组件开发基础

    前言 vue作为一个轻量级前端框架,其核心就是组件化开发.我们一般常用的是用脚手架vue-cli来进行开发和管理,一个个组件即为一个个vue页面,这种叫单文件组件.我们在引用组件之时只需将组件页面引入 ...

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

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

  6. 为什么不能在 body 标签的前面的 script 标签中定义 JS 全局变量?

    <!DOCTYPE html> <!-- 为什么不能在 body 标签的前面的 script 标签中定义 JS 全局变量? 在全局环境下的代码就是在页面加载阶段从上到下一边加载一边执 ...

  7. vue.js数据可以在页面上渲染成功却总是警告提示某个字段“undefined”未定义

    最近在开发公司的一个后端管理系统,用的是比较流行的vue框架.在开发过程中,总是出现各种各样的报错问题,有警告的,有接口不通的,有自己马虎造成的低级错误的等等,这些错误在一些老司机面前分分钟解决,但今 ...

  8. Vue.js 2.x:组件的定义和注册(详细的图文教程)

    本文最初发表于博客园,并在GitHub上持续更新前端的系列文章.欢迎在GitHub上关注我,一起入门和进阶前端. 以下是正文. 前言 什么是组件 组件: 组件的出现,就是为了拆分Vue实例的代码量的, ...

  9. Bug记载2之Vue.JS路由定义的位置

    <!DOCTYPE html><html lang="en"> <head> <meta charset="UTF-8" ...

随机推荐

  1. 【Graphite】使用dropwizard.metrics向Graphite中写入指标项数据

    graphite 定时向Graphite中写入指标项数据,指标项模拟个数3000个 使用的类库 官方文档   dropwizard的github地址 Metric官方文档 metrics.dropwi ...

  2. 解决 liblog4cpp.a: could not read symbols: Bad value

    将 liblog4cpp.a 链接进一个 so, 编译时出现 : liblog4cpp.a(RollingFileAppender.o): relocation R_X86_64_32 against ...

  3. springboot(运行原理参考借鉴)

    什么是springboot答:Spring Boot makes it easy to create stand-alone, production-grade Spring based Applic ...

  4. [转]SQL数据库查询到的汉字字段是乱码

    使用英文版SQL数据库查询到的汉字字段是乱码的解决方案 2007-12-04 14:55:45 标签:函数 SQL 数据库 乱码 排序规则 原创作品,允许转载,转载时请务必以超链接形式标明文章 原始出 ...

  5. RPM安装MYSQL5.7

    RPM安装MYSQL5.7 1:YUM安装依赖库 yum install perl libaio numactl 2:下载安装需要的RPM包 https://dev.mysql.com/get/Dow ...

  6. [UE4]如何编译部署独立专用服务端(Standalone Dedicated Server)

    这是论坛上对UE服务端功能的回答,意思是UE4提供了网游服务端所具备的特性,包括位移修正.物理碰撞检测.这些特性不是UE4才加入,早期UE版本就有了. https://answers.unrealen ...

  7. [UE4]制作视野图标

    一.在PhotoShop中新建一个64px*64px,背景色为透明的文档 二.填充“图层1”为白色 三.添加蒙版图层,并将前景色设置为黑色 四.将“图层1”选择45°,并往上拖放至如图位置 五.选择渐 ...

  8. npm rebuild node-sass

    在使用npm安装node-sass的时候,可能会出现如下的报错: Error: ENOENT: no such file or directory, scandir 'D:\IdeaWork\code ...

  9. 第2章 GNS3和PacketTracer网络模拟器(2)_搭建GNS3实验环境

    2. GNS3实验环境 2.1 教学实验1:配置路由器和VPCS (1)配置VPCS虚拟电脑的IP地址命令 //配置VPCS电脑的IP地址等信息 PC1> ? //查看可用的命令 PC1> ...

  10. Hiveserver2高可用实现

    在生产环境中使用Hive,强烈建议使用HiveServer2来提供服务,好处有: 在应用端不用部署Hadoop和Hive客户端: 相比hive-cli方式,HiveServer2不用直接将HDFS和M ...