在项目中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. 简易OA漫谈之工作流设计(五,直接上级)

    规则引擎里比较复杂的问题就是:配置步骤的审批人. 某一个步骤由谁来审批,有很多复杂情况: 1.指定某一个具体的人.这种通常用于一些特殊的岗位,全公司只有一个,比如小公司里的财务,人事专员等. 2.指定 ...

  2. .gitconfig

    [user] name = 1111 email = 111@111.com[credential] helper = store

  3. [CentOS 7] TexLive2017中kpsewhich Bug的修复

    使用TexLive有一段时间了,从2015到2017,一直运行如常. 最近,想把以前的文档重新编译,却发现不能正常运行,费了好大一番工夫,才终于修复了这个bug,记录如下. 问题描述:编译一个简单的 ...

  4. 数据可视化之 tick_params( 参数 )

    参考:https://blog.csdn.net/helunqu2017/article/details/78736554/ 初学数据可视化,遇到了tick_params() 里面传参数问题,找了一些 ...

  5. git命令简介

    git作为版本控制器,多分支功能能够很好的协同开发.其中分支中分为主分支和辅助分支 主分支包括:master分支和develop分支,不多做解释 辅助分支包括一下三种分支,其中 需求分支(Featur ...

  6. java按照指定格式输出系统时间使用SimpleDateFormat方法

    public class TimeThree { public static void main(String[] args) { SimpleDateFormat d = new SimpleDat ...

  7. SSE技术详解:使用 HTTP 做服务端数据推送应用的技术

    SSE ( Server-sent Events )是 WebSocket 的一种轻量代替方案,使用 HTTP 协议. 严格地说,HTTP 协议是没有办法做服务器推送的,但是当服务器向客户端声明接下来 ...

  8. 关于SQLSERVER数据库连接池

    页内导航 1.如何开启连接池? 2. 那连接池是和有什么有关呢? 3.如何使用相同的连接池访问不同的数据库? ‘关于数据库连接池大家都听说过或者用过,但真正的了解有多少呢? 数据连接池如何启用?有哪些 ...

  9. 漫谈hashcode

    概要 对于hashcode,相信很多朋友都不陌生,应为我们很多时候都需要用到这个,比如hashMap中就用到了,根据key的hash值来决定value存放的位置,之后来取得时候直接到指定的位置上那就行 ...

  10. Python面向对象基础知识

    面向对象是一种编程方式,此编程方式的实现是基于对类和对象的使用 类是一个模板,模板中包装了多个“函数”供使用(可以讲多函数中公用的变量封装到对象中) 对象,根据模板创建的实例(即:对象),实例用于调用 ...