zoukankan      html  css  js  c++  java
  • vue加载外部json配置文件

    在vue开发中遇到 加载json配置文件,而且这个配置文件不应被打包

    这就需要在 public 目录下 创建static目录 。

     

     在static目录下 创建 config.json 文件 ,文件内容如下:

    {
        "apiUrl": "http://localhost/VueApi" 
    }

    读取方法分两种

    一、在main.js 文件中直接读取、调用 

    Vue.prototype.$http.get('static/config.json').then((res)=>{
      //console.log('11111111');
      var apiUrl= res.data.apiUrl;
      console.log('apiUrl '+apiUrl);
      axios.defaults.baseURL =apiUrl;//'http://localhost/VueApi';
    }).catch(err => {
      console.log("apiUrl "+err);
    })

    这样 取到  apiUrl 后 直接赋给   axios.defaults.baseURL

    二、在main.js读取 并 在 任意 *.vue 页面上调用

    //获取 外部config.json 
    Vue.prototype.$http = axios;
    Vue.prototype.getConfig = function () {
      //this.$http.get('../static/config.json').then(res => {
      this.$http.get('static/config.json').then((res)=>{
        Vue.prototype.apiUrl = res.data.apiUrl;
        console.log('11111111');
        console.log(Vue.prototype.apiUrl);
      }).catch(err => {
        console.log(err);
        //console.log('22222');
      })
    }

    调用方法

      mounted() {  //页面 加载完毕 必须要有 this.
        //console.log(this.getConfig());
        this.getConfig()
    
      },
  • 相关阅读:
    Python matplotlib基本设置
    Python可视化工具
    使用Python进行数据分析——常见实用的第三方库
    Python第三方库安装
    Python pip的安装
    Python cx_Oracle数据库连接
    Python安装使用(WinXP)
    大数据学习路线(转载)
    SQL 数据库学习之路-转自大神笔记
    Java字符串处理函数汇总
  • 原文地址:https://www.cnblogs.com/hailexuexi/p/14249184.html
Copyright © 2011-2022 走看看