Axios初步

首先导入CDN

1.          
2.         
3.            

复制代码

然后在“script”标签书写。其中先建立一个后缀名为“json”的文件，该文件有两种参考写法，且都不支持注释
写法一：每个独立的对象都被包装在一个顶层对象中，其中的键是自定义的名称。这样就符合了JSON的语法规则。每个内部对象都有自己的键值对，并且整个结构由一个大括号包围，表示这是一个单一的JSON对象。

1. {
2.     "hunshuideyunxue": {
3.         "name": "hunshuideyunxue",
4.         "age": 20,
5.         "address": "qiludadi"
6.     },
7.     "百度": {
8.         "name": "hunshuidezhangyu",
9.         "url": "https://www.baidu.com"
10.     },
11.     "B站": {
12.         "name": "B站",
13.         "url": "https://www.bilibili.com"
14.     }
15. }

复制代码

或者所有对象都被放置在一个数组中，由方括号包围。

1. [
2.     {
3.         "name": "hunshuideyunxue",
4.         "age": 20,
5.         "address": "qiludadi"
6.     },
7.     {
8.         "name": "yun",
9.         "url": "https://www.baidu.com"
10.     },
11.     {
12.         "name": "B站",
13.         "url": "https://www.bilibili.com"
14.     }
15. ]

复制代码

　　然后在“html”文件中的“script”标签中写

1. mounted(){ //钩子函数，链式编程
2.            axios.get('data.json').then(response=>(console.log(response.data)));
3.            //连接“deta.json”文件，拿到后在控制台输出“data.json”中的内容<br>　　　　　　　//注意该文件与当下的这个文件的位置关系
4.        }

复制代码

此时运行后在浏览器控制台中就可以查看输出内容，本次用的HbuiderX所写。可能因为环境等问题导致浏览器无法显示文件内的元素，求解！！！

来源：程序园用户自行投稿发布，如果侵权，请联系站长删除
免责声明：如果侵犯了您的权益，请联系站长，我们会及时删除侵权内容，谢谢合作！