在项目中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. [luogu P2375] [NOI 2014] 动物园

    [luogu P2375] [NOI 2014] 动物园 题目描述 近日,园长发现动物园中好吃懒做的动物越来越多了.例如企鹅,只会卖萌向游客要吃的.为了整治动物园的不良风气,让动物们凭自己的真才实学向 ...

  2. 泛在电力物联网建设大纲ppt

    “三型两网”,国家电网在2019年提出的新战略目标.其中,“两网”分别代表着,“坚强智能电网”和“泛在电力物联网”.“坚强智能电网”的概念已经随着特高压的持续建设而被大家渐渐熟知,那么“泛在电力物联网 ...

  3. 基于Live555实现RtspServer及高清高分辨率和高码率视频传输优化

    基于Live555实现RtspServer及高清高码率视频传输优化 最近做了一些pc和嵌入式平台的RTSP服务器项目,大多数的要求是简单但是功能全面,并且性能还要强劲.综合考虑后,基本都是在基于liv ...

  4. js的回调函数

    介绍首先从英文介绍开始 A callback is a function that is passed as an argument to another function and is execut ...

  5. Python爬取qq空间说说

    #coding:utf-8 #!/usr/bin/python3 from selenium import webdriver import time import re import importl ...

  6. 最长公共子串和子序列的Python实现,带图示。

    使用矩阵来记录两个子串之间各个字符之间的对应关系. 最长子串:矩阵中数字最大的就是最长子串的长度.若对应位置字符相同,则c[i][j] = c[i-1][j-1] + 1 def longSubStr ...

  7. nginx之location的匹配规则

    nginx之location的匹配规则 一.语法规则 location [=|~|~*|^~] /uri/ { - } 符号 含义 = 开头表示精确匹配 ^~ 开头表示 uri 以某个常规字符串开头 ...

  8. 使用 spring封装的javamail linux服务器发送邮件失败解决

    原文参考:https://blog.csdn.net/a540891049/article/details/79385471 由于某些平台的linxu服务器为了安全起见 屏蔽了发送邮件的常用端口 25 ...

  9. 启动ssh服务 XSshell 生成秘钥 并注册公钥在Ubuntu linux

    安装ssh服务:sudo apt-get install openssh-server 查看ssh服务:    ps -ef | grep ssh 查看之后正常显示如下3行:root        8 ...

  10. JAVA面向对象之继承

    继承: 子类继承父类的特征和行为,使得子类对象(实例)具有父类的实例域和方法 class 子类 extends 父类 { } 继承的特性: 子类拥有父类非private的属性,方法. 子类可以拥有自己 ...