构建后支持配置化修改

基于Vue的项目开发中，构建打包之后需要支持修改后端接口地址。

解决思路是采用window全局对象注入变量。

在static文件夹中定义全局变量config.js

window.gobal = {
  //Api地址
  apiBaseUrl: "http://192.168.1.110:7999",
  //请求超时
  requestTimeout: 30000,
  //请求类型
  requestHeader: {
    'Content-Type': 'application/json',
    'Content-Type': 'application/json-patch+json',
    'X-Requested-With': 'XMLHttpRequest'
  }
}

在index文件引入config.js。为了便捷，可以注册成Vue全局属性。

Vue.prototype.$apiBaseUrl = window.gobal.apiBaseUrl;

这样在组件中就直接使用了。

如何新开一个页面

基于SPA构建的Vue，路由route的引入，替换了原来页面的概念。在没有页面的前提下，如何新开一个页面窗口呢？

解决思路是模拟a标签触发新开一个页面。

let a = this.$refs.previewMap;
let url = `http://${window.location.host}/#/ol/${this.$route.params.uuid}`;
a.setAttribute("href", url);
a.click();

访问地址配置

修改package.json 在scripts dev后面加 --host 0.0.0.0