2020 零基础 Vue快速入门 Vue2.0使用ES6语法的箭头函数=> 对this作用域的理解【整理】

最新推荐文章于 2024-04-28 09:30:00 发布

一百个Chocolate

最新推荐文章于 2024-04-28 09:30:00 发布

阅读量2.4k

点赞数 9

分类专栏： Vue全家桶系列文章标签： vue java python js javascript

原则上允许部分内容转载，转载请注明原文章地址！

本文链接：https://blog.csdn.net/weixin_42429718/article/details/103969483

版权

文章目录

1、引言

最近，学Vue相关知识时，学到了axios，发现axios请求之后的回调函数里this并不指向当前vue实例，在浏览器按F12报了错，赶紧想着去解决问题，后面才知道原来还有箭头函数这个简便操作，一起来了解一下把~

2、简单介绍

关于它们两个的比较，我就以请求一个随机获取笑话的api为例了，来说明它们的区别，主要界面如图：
在这里插入图片描述
接口描述如下：

接口：随机获取一条笑话
请求地址：https://autumnfish.cn/api/joke
请求方法：get方法
请求参数：无
响应内容:随机一条笑话

3、普通函数

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>第一个Vue程序</title>
		<script src="https://unpkg.com/axios/dist/axios.min.js"></script>
		<!-- 开发环境版本，包含了有帮助的命令行警告-->
		<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
	</head>
	<body>
		<div id="app">
			<input type="button" value="查看一个笑话" &