模块化之后,想用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. 阿里云服务器 ECS Linux SWAP 配置概要说明

    SWAP 简介 Linux 中的 SWAP(交换分区),类似于 Windows 的虚拟内存.系统会把一部分硬盘空间虚拟成内存使用,将系统内非活动内存换页到 SWAP,以提高系统可用内存. 注:参阅 E ...

  2. 定位cpu内存问题

    定位cpu内存问题 ps -Hp pid  显示进程的线程,P 按CPU内存排序 jstack pid>pid.log 将线程栈 dump 到日志文件中 线程号 十进制转换为 十六进制 在文件中 ...

  3. mysql 锁2

    官网地址 https://dev.mysql.com/doc/refman/5.5/en/innodb-transaction-isolation-levels.html 这里主要是说事务隔离级别,以 ...

  4. linux 查看进程启动路径

    在linux下查看进程大家都会想到用 ps -ef|grep XXX 可是看到的不是全路径,怎么看全路径呢? 每个进程启动之后在 /proc下面有一个于pid对应的路径 例如:ps -ef|grep ...

  5. webpack + vuejs(都是1.0的版本) 基本配置(一)

    开始之前 本文包含以下技术,文中尽量给与详细的描述,并且附上参考链接,读者可以深入学习: 1.webpack12.Vue.js13.npm4.nodejs —- 这个就不给连接了,因为上面的连接都是在 ...

  6. java打印实心10*10正方形, 空心10*10正方形

    public class PrintSquare { public static void main(String[] args) { printSolidSquare(10); System.out ...

  7. github_地址

    网络请求: hongyangAndroid/okhttputils(包含cookie的管理): 图片之压缩: Sunzxyong/Tiny:(http://www.tuicool.com/articl ...

  8. Jmeter(九)JDBC连接池

    JDBC为java访问数据库提供通用的API,可以为多种关系数据库提供统一访问.因为SQL是关系式数据库管理系统的标准语言,只要我们遵循SQL规范,那么我们写的代码既可以访问MySQL又可以访问SQL ...

  9. Rehash死锁的问题

    为什么都说HashMap是线程不安全的呢?它在多线程环境下,又会发生什么情况呢? resize死循环 我们都知道HashMap的初始容量是16,一般来说,当插入数据时,都会检查容量有没有超过设定的th ...

  10. document.createRange剪贴板API

    js实现复制到剪贴板 document.createRange() API 选中元素→range→selection是一一对应的,即选区必须连续,不可以有分开的多个区域.另外,被选元素必须在dom树上 ...