在项目中api管理需要用到全局变量,创建全局变量的方式也有很多。

1.通过export default

  const BASEURL = "http://localhost:3333/"
  const URL = {
    getCategory:BASEURL+'category',
    getGoodsInfo:BASEURL+'getGoodsInfo'
  }
  export default URL
  在入口文件中引入

  import url from './api/api'

  Vue.prototype.URL=url;

2.通过module.exports

const BASEURL = "http://localhost:3333/"
const URL = {
getCategory:BASEURL+'category',
getGoodsInfo:BASEURL+'getGoodsInfo'
}

module.exports = URL;

在入口文件中引入Vue.prototype.URL=require('./api/api.js');

其实以上两种都是Vue.prototype原型引入;

3.通过node.js的global全局变量

global.apiBase={}
apiBase.baseUrl='http://localhost:3333/'

apiBase.getBanner="/banners"
apiBase.getcategory="/category"

export default {
  apiBase
};

在路口文件中直接引入

import  ApiBase from './api/api'

4.通过VUEX的状态管理

   import Vue from 'vue';

   import Vuex from 'vuex';Vue.use(Vuex);

const state = {}

  直接定义在state状态里面

5.通过window对象设置

 

vue项目中全局配置变量的更多相关文章

  1. Vue 项目中 ESlint 配置

    前言 对于 ESlint 这一块一直存在一些疑问,今天看到一个文章内容挺好的,这里拿来了. 一.eslint 安装 1.全局安装 npm i -g eslint 全局安装的好处是,在任何项目我们都可以 ...

  2. rem的在vue项目中使用配置,,浏览器的兼容性之Mate标签

    在vue中配置rem 位置:在APP.vue的script中,在export default之外 (()=>{ let winW = document.documentElement.clien ...

  3. vue项目中设置全局引入scss,使每个组件都可以使用变量

    在Vue项目中使用scss,如果写了一套完整的有变量的scss文件.那么就需要全局引入,这样在每个组件中使用. 可以在mian.js全局引入,下面是使用方法. 1: 安装node-sass.sass- ...

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

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

  5. vue项目中postcss-pxtorem的使用及webpack中的配置 css中单位px和em,rem的区别

    移动手机版要求我们在制作嵌入h5的时候去适配不同的手机.适配有多重模式,有flex.百分比等.字体大小的控制也有px.百分比.rem等单位,webpack中 px转rem. vue项目中postcss ...

  6. 在vue项目中的axios使用配置记录

    默认vue项目中已经安装axios,基于element-ui开发,主要记录配置的相关. axiosConfig.js import Vue from 'vue' import axios from ' ...

  7. 前端学习笔记系列一:10整体移动vscode代码块、VSCode 使用 stylus,配置格式化设置、在vue项目中引入bootstrap

    1.整体移动vscode代码块 凭借操作的经验我们能够轻松地知道将代码整体往右移只需选中代码按Tab键即可.其实往左移也很简单: 选中之后按下 shift+Tab键 即可. 2.VSCode 使用 s ...

  8. vue项目中遇到的一些问题

    或访问:https://github.com/littleHiuman/experiences-about-vue  欢迎补充! vuex 状态 vue-cli 命令行 vue vue vue-rou ...

  9. vue项目中使用bpmn-自定义platter

    前情提要 经过前四篇的学习,我们能够实现bpmn基本绘图.预览.为节点加事件加颜色等效果,这一篇我们来说,如何自定义左侧工具栏(platter),首先看一下自定义前后效果图对比: 我们本次要实现的目标 ...

随机推荐

  1. apk文件二维码微信无法识别 APP在微信中二维码扫描无法下载的解决方案

    现在微信分享的功能很多,从分享的链接下载apk安卓包是很正常的,但是微信不让下载apk包,只能通过浏览器来下载,但是这要给用户一个提示吧,不然用户不知道 下面我们来实现,引导用户通过浏览器来下载apk ...

  2. CSS3-1

    css3 1  学习前置条件:html + css2 2  概述 *历史 css3 就是层叠样式表的目前的最高版本,带来了许多新特性.如,圆角.渐变.过渡.动画.新布局(多列布局缩进盒子等) // c ...

  3. Mysql 了解changeBuffer 与 purge 调优

    需要删除.新增记录或更新一个数据页时,如果数据页在内存中就直接更新,而如果这个数据页还没有在内存中的话,在不影响数据一致性的前提下,InooDB 会将这些更新操作缓存在 change buffer中, ...

  4. Linux配置JDK、Tomcat和Mysql免安装版

    现在已有JDK.Tomcat和mysql的tar.gz压缩文件 1.解压文件 (1)解压tar.gz tar -zxvf 待解压文件名 -C 解压到目标文件目录 (2)解压zip unzip 待解压文 ...

  5. JS案例六_2:省市级联动

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

  6. POJO、JavaBean、DTO的区别

    一.POJO(Plain Ordinary Java Object)简单的Java对象,其中有一些属性及其getter setter方法的类,没有业务逻辑(重点理解一下"没有业务逻辑&quo ...

  7. react 表单受控和非受控

    参见:https://goshakkk.name/controlled-vs-uncontrolled-inputs-react/ 非受控: onSubmit = ()=>{ const val ...

  8. 说一说js中的闭包

    不说官方给的定义,感觉自己刚开始看也不是很理解. 闭包 : 其实就是 该函数能使用函数外定义的变量. 为什么要使用闭包? 首先来说一下局部变量和全局变量的危害: 全局变量容易全局污染,局部变量又无法共 ...

  9. boostrap 日期插件(带中文显示)

    不知道大家用什么样的日期插件,我最近用了bootstrap插件,整理了下,分享给大家,第四部分是我找的插件源码,可以省去大家的找的时间,按1-3的步骤用就好了,有些样式上的小问题就自己调一调: (1) ...

  10. IIS10安装IIS URL重写模块2伪静态组件提示需要IIS7.0以上版本。

    解决方法: 打开注册表 HKEY_LOCAL_MACHINE\SOFTWARE\Microsoft\InetStp 双击右边MajorVersion,默认的数值是a,修改成9,然后再安装 ,安装完成后 ...