Vue 读取本地静态文件 json【2种方法及优缺点】_vue 从assets中读取json

结尾

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

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

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

格式：

this.$ajax.get('http://localhost:80/static/map/province/anhui' +'.json')
.then( response => {
    this.json = response.data;                    
})

说明：

1、上面的ajax的请求地址，是你的服务器地址。简单来说，你复制这个地址去浏览器可以访问到你的json数据。

2、上面的 ajax 是 axios。我只是给它重新取了个名字

3、缺点是，你无法控制ajax什么时候去调用的。很可能当你需要数据的时候，即使你把上面请求的代码，放在最前面都可能不行。

4、解决办法。如果你请求的数据只有一次一个。那么你只需要把你的渲染代码。放在ajax的回调函数里面就好了。

5、如果你是多次请求，你可以考虑一下ajax的嵌套。  所有的渲染页面，都放在ajax里面，一定确保要渲染的时候已经获取到了数据。

总结：  
    虽然，require 来获取数据很简单，很容易被接受。但是js太大，这一个缺点就抹杀了它。推荐使用ajax。

最后为了方便大家的沟通与交流请加QQ群： 625787746

请进QQ群交流：【IT博客技术分享群①】：https://jq.qq.com/?_wv=1027&k=DceI0140

最后

编程基础的初级开发者，计算机科学专业的学生，以及平时没怎么利用过数据结构与算法的开发人员希望复习这些概念为下次技术面试做准备。或者想学习一些计算机科学的基本概念，以优化代码，提高编程技能。这份笔记都是可以作为参考的。

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