zoukankan      html  css  js  c++  java
  • vue 设置全局变量并且可以在浏览器控制台更改

    后端提供了一个接口,要求可以在浏览器控制台更改参数,以方便后端可以随时更改参数

    • 新建一个存放全局变量的js文件,如: params.js,内容如下:
    export default {
        de:'qweqweqweqwe',     //封装的axios中要用到的默认值
        setParams(v){      //用于浏览器修改全局变量"de" 
            this.de= v
        }
    }
    
    • main.js 
    import params from './params'   //引入params.js
    Vue.prototype.$params = params  //挂载到vue实例上,以便项目随处可用
    const vm = new Vue({        //vue实例定义为变量
      router,
      store,
      render: h => h(App)
    }).$mount('#app')
    window.params= vm.$params    //挂载到window对象上,以便浏览器可以访问
    export default vm         //把vue实例暴露出去,以便js文件可以访问到vue实例
    
    • request.js (封装的axios文件)
    import axios from 'axios'
    import vm from '@/main'        //引入main.js以便访问vue实例
    
    axios.interceptors.request.use(
      config => {
        config.params = { 'xxxxxxxx': vm.$params.de }   //这里要用到params.js定义的de(默认值)
        return config
      },
      error => {
        return Promise.reject(error)
      }
    )

      现在可以打开浏览器控制台,输入params,会出现:

    {
        de:'qweqweqweqwe',    
        setParams(v){      
            this.de= v
        }
    }
    

      输入params.setParams('abcdefg')  ,  哈哈,  你再调用接口,  大功告成!

  • 相关阅读:
    Power of Cryptography
    Radar Installation
    Emag eht htiw Em Pleh
    Help Me with the Game
    89. Gray Code
    87. Scramble String
    86. Partition List
    85. Maximal Rectangle
    84. Largest Rectangle in Histogram
    82. Remove Duplicates from Sorted List II
  • 原文地址:https://www.cnblogs.com/Bob0411/p/12526617.html
Copyright © 2011-2022 走看看