因项目需要,打包后需要更改获取数据的mqtt的ip和端口号。

本项目是基于若依框架,所以项目目录如下:

1.在public文件夹下创建config.json文件,把后续要更改的ip或者baseUrl写在里面

2.在main.js里添加以下代码

// 引入axios
import axios from 'axios'


function getServerConfig() {
  return new Promise((resolve, reject) => {
    axios
      .get("/config.json")
      .then(result => {
        Vue.prototype.globalUrl = result.data.globalUrl;
        Vue.prototype.mqttHost = result.data.mqttHost;
        Vue.prototype.mqttPort = result.data.mqttPort;
        resolve();
      })
      .catch(error => {
        console.log(error);
        reject();
      });
  });
}



async function init() {
  await getServerConfig();
}
init();

 3.在封装mqtt的js文件里引用挂载在原型上的全局变量,注意:直接使用this.mqttHost会报错显示是undefined

import Vue from 'vue'
var vm = new Vue();
//引用的时候,在需要引用变量的地方使用vm.变量名,例如vm.mqttHost

Logo

OpenTiny 是企业智能前端开发解决方案,以生成式 UI 和 WebMCP 两大自主核心技术为基础,加速企业应用的智能化改造。我们会在社区定期为大家分享一些前后端的技术文章。

更多推荐