最近做毕设，后端采用的是Spring boot，通过Neo4jRepository从neo4j中获取数据，前端框架是Vue，通过axios请求后端数据，并处理成符合Echarts规范的数据格式，之后Echarts进行渲染。在前端渲染数据的过程中遇到好多坑。 首先是如何对后端返回的数据进行处理。后端返回的数据格式是这样的： [ { "id": 1, "name": "CSS" }, { "id": 2, "name": "Javascript", "derives": [ { "id": 3, "name": "Vue.js" } ] }, { "id": 3, "name": "Vue.js" }, { "id": 171, "name": "前端技术", "includes": [ { "id": 1, "name": "CSS" }, { "id": 2, "name": "Javascript", "derives": [ { "id": 3, "name": "Vue.js" } ] }, { "id": 172, "name": "HTML", } ] }, { "id": ....

前言 之前曾经想自己写一个天气的App，并找到了一个免费的天气数据接口的服务商——和风天气，当时也不懂怎么发HTTP请求，而且也只会用Java语言，看到官方文档里面有一个Java代码示例，就复制了一下在自己电脑上调通。一开始是在控制台输出天气数据的，后来用Swing写了一个图形化界面并放置数据，但也就到此为止了，并没有什么实用价值。 最近学习了一下前端的相关知识，发现像和风天气这样的数据接口，根本不需要用到像Java这样的大型语言，只需在网页端用Javascript发HTTP请求就能获得JSON数据，之后再渲染到HTML网页，大大节省了资源利用和开发时间，并了解到开发这样的网页最适合的方式就是使用AJAX，因为它可以实现网页的局部更新。这样我就可以实现如下的业务场景：输入想要搜索的城市，点击搜索，下面显示出该城市的天气信息，而不影响页面的其他内容。有时候JS调用AJAX请求会有跨域问题，但和风天气的数据接口并没有这个问题。 具体场景 界面如图： 在输入框输入城市名，点击搜索按钮，可以在下面显示出各项数据（从接口获得）。 大致的HTML代码如下： <div class="cont....