Vue开发及上线过程中遇到的坑（axios跨域，history模式下空白页问题）_axios采用history刷新后找不到页面(2)

最后

javascript是前端必要掌握的真正算得上是编程语言的语言，学会灵活运用javascript，将对以后学习工作有非常大的帮助。掌握它最重要的首先是学习好基础知识，而后通过不断的实战来提升我们的编程技巧和逻辑思维。这一块学习是持续的，直到我们真正掌握它并且能够灵活运用它。如果最开始学习一两遍之后，发现暂时没有提升的空间，我们可以暂时放一放。继续下面的学习，javascript贯穿我们前端工作中，在之后的学习实现里也会遇到和锻炼到。真正学习起来并不难理解，关键是灵活运用。

开源分享：【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】

Axios的Get请求：

格式：this.axios.get(this.url.api.categoryQueryWeb).then(function (res) {})

带参数的 用params：{参数名：值,参数名：值}

POST请求

需先定义一个

let params = new URLSearchParams();

然后将参数给拼接进去即可

**2.**在使用vue.js框架的时候，有时候会希望在页面渲染完成之后，再来执行某个函数方法比如获取某个列表的高度时，必须要在页面完全渲染之后才可以，页面没有加载完成之前，获取到的高度不准确。

Vue文档中有个mounted函数，说是挂载到实例上去之后调用该钩子，差不多相当于在页面渲染之后再加载，但是经检测，函数放在mounted里执行时，高度并不正确，而且在函数那打个断点的话，在执行到这时，列表并没有渲染出来。再查看文档有个nextTick方法代表等到整个视图渲染完毕之后调用，但是结果还是不正确

最后查了一些资料，发现可以通过watch和nextTick 来达到我想要的效果

headImgList 是我要监听的列表数组，当他全部加载结束之后再调用 pcGlasses() 方法

**3.**Vue项目打包上传

1.配置线上环境的接口地址

找到config目录下的prod.env.js 配置你的线上服务地址

然后将你之前的url.js  里的地址改为

let apiUrl = process.env.API_ROOT

就好了

2.Vue项目打包

在执行 npm run build 之前得先改一下配置文件找到config目录下的index文件，将下图红框位置上的“/” 改为 “./” ;“true”改为 “false”

按上述打包访问链接里会多个# ，如下图所示

如何把”#” 给去掉呢我们可以用路由的 history 模式 在router的index.js 里加一句mode:’history’

这样链接里就没有#号了，但是出现一个问题就是放到线上之后一刷新页面就变成空白页或者404找不到了，这是为什么呢，vue文档里有说明history 模式下要想正常运行还需要后端的支持具体可撮：https://router.vuejs.org/zh/guide/essentials/history-mode.html

如果服务器是apache的话，需要在配置文件中加入下面几句代码：

<IfModule mod_rewrite.c>

结尾

学习html5、css、javascript这些基础知识，学习的渠道很多，就不多说了，例如，一些其他的优秀博客。但是本人觉得看书也很必要，可以节省很多时间，常见的javascript的书，例如：javascript的高级程序设计，是每位前端工程师必不可少的一本书，边看边用，了解js的一些基本知识，基本上很全面了，如果有时间可以读一些，js性能相关的书籍，以及设计者模式，在实践中都会用的到。

开源分享：【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】

高级程序设计，是每位前端工程师必不可少的一本书，边看边用，了解js的一些基本知识，基本上很全面了，如果有时间可以读一些，js性能相关的书籍，以及设计者模式，在实践中都会用的到。

些，js性能相关的书籍，以及设计者模式，在实践中都会用的到。