简单的axios请求返回数据解构赋值
本地 data.json 文件
{
"name": "大熊",
"age": 18,
"fnc": [
1,
2,
3
]
}
<!DOCTYPE html>
<html lang="en"> <head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title> </head> <body> </body> </html>
//引入axios 的cdn
<script src="https://unpkg.com/axios/dist/axios.min.js"></script>
<script>
//通常的写法:
axios.get('./js/data.json').then(function(res){
console.log(res)
})
</script>
打印:
解构赋值 写法: 花括号,里面的data字段解构赋值,记住花括号
axios.get('./js/data.json').then(({ data }) => {
console.log(data)
})
打印:
直接取 data里面的 name age
axios.get('./js/data.json').then(({ data: { name, age } }) => {
console.log(name, age)
})
打印: 大熊 18
解构赋值正确用法:
简单的axios请求返回数据解构赋值的更多相关文章
- 变量的解构赋值////////////z
变量的解构赋值 数组的解构赋值 对象的解构赋值 字符串的解构赋值 数值和布尔值的解构赋值 函数参数的解构赋值 圆括号问题 用途 数组的解构赋值 基本用法 ES6允许按照一定模式,从数组和对象中提取值, ...
- ECMAScript 6入门 - 变量的解构赋值
定义 ES6允许按照一定模式,从数组和对象中提取值,对变量进行赋值,这被称为解构(Destructuring). 解构赋值不仅适用于var命令,也适用于let和const命令. 解构赋值的规则是,只要 ...
- ECMAScript 6之变量的解构赋值
1,数组的解构赋值 基本用法 ES6允许按照一定模式,从数组和对象中提取值,对变量进行赋值,这被称为解构(Destructuring). 以前,为变量赋值,只能直接指定值. var a = 1; va ...
- ES5-ES6-ES7_解构赋值
解构赋值的概念 ES6允许按照一定模式,从数组和对象中提取值,对变量进行赋值,这被称为解构(Destructuring) 传统对变量赋值的方式,以前,为变量赋值,只能直接指定值. var a = 1; ...
- ES6的新特性（3）——变量的解构赋值
变量的解构赋值 数组的解构赋值 基本用法 ES6 允许按照一定模式,从数组和对象中提取值,对变量进行赋值,这被称为解构(Destructuring). let a = 1; let b = 2; le ...
- 《ES6标准入门》(阮一峰)--3.变量的解构赋值
1.数组的解构赋值 基本用法 ES6 允许按照一定模式,从数组和对象中提取值,对变量进行赋值,这被称为解构(Destructuring). 以前,为变量赋值,只能直接指定值. let a = 1; l ...
- 03 | 变量的解构赋值 | es6
变量的解构赋值 数组的解构赋值 基本用法 ES6 允许按照一定模式,从数组和对象中提取值,对变量进行赋值,这被称为解构(Destructuring). 以前,为变量赋值,只能直接指定值. let a ...
- Es6 新增解构赋值
1.数组的解构赋值 基本用法 ES6 允许按照一定模式,从数组和对象中提取值,对变量进行赋值,这被称为解构(Destructuring). 要想实现解构,就必须是容器,或者具有可遍历的接口. 以前,为 ...
- ES6学习笔记（let,const,变量的解构赋值）
1.let: ; i < 3; i++) { let i = 'abc'; console.log(i); } // abc // abc // abc 不存在变量提升,它所声明的变量一定要在声 ...
随机推荐
- laravel7 h-ui点改
html: <td> @if($item->fang_status == 0) <span onclick="changeFangStatus(this,{{$ite ...
- think php 登录 （session+验证码）
..........表单页面 <!DOCTYPE html> {__NOLAYOUT__} <html lang="en"> <head> &l ...
- thinkphp 框架自带搜索+分页+搜索标红
..........控制器方法 public function index() { //接受搜索关键字 $word=input('word'); $where=[]; if (!empty($word ...
- 『现学现忘』Docker常用命令 — 19、容器常用命令（一）
目录 1.新建并启动容器 2.列出当前所有正在运行的容器 3.退出容器 4.启动容器 5.重启容器 6.停止容器 7.强制停止容器 8.删除已停止的容器 有镜像才能创建容器,这是根本前提. 我们下载一 ...
- 分享一些阅读Java相关框架源码的经验
昨天和部分网友进行了线上的交流,交流中有不少网友提到阅读源码比较难,不知道怎么上手.胖哥分享了一些个人经验,这里总结一下. 阅读源码实际上是Debug源码 其实所谓的阅读源码并不是单纯的阅读,而是调试 ...
- 一步一步迁移ASP.NET Core 6.0-Part1
.NET 6 发布后,我们现有的应用会逐步升级到这个版本,首当其冲的是原因的ASP.NET Core的工程,如果一步一步升级到ASP.NET Core 6.0 本文简单整理一下升级ASP.NET Co ...
- RISC / CISC
RISC(精简指令集计算机)和CISC(复杂指令集计算机)是当前CPU的两种架构.它们的区别在于不同的CPU设计理念和方法. CPU架构是厂商给属于同一系列的CPU产品定的一个规范,主要目的是为了区分 ...
- linux 查看命令
linux查找命令 ls查看文件信息 就是list的缩写,通过ls 命令不仅可以查看linux文件夹包含的文件,而且可以查看文件权限(包括目录.文件夹.文件权限)查看目录信息等等 常用参数搭 ...
- 4月17日 python学习总结 反射、object内置方法、元类
一.反射 下述四个函数是专门用来操作类与对象属性的,如何操作? 通过字符串来操作类与对象的属性,这种操作称为反射 class People: country="China" def ...
- python 命令行参数学习（二）
照着例子看看打打,码了就会.写了个命令行参数调用进行运算的脚本. 参考文章链接:http://www.jianshu.com/p/a50aead61319 #-*-coding:utf-8-*- __ ...