axios异步问题

情景介绍

做了一个点击按钮，屏蔽表格中一行信息的功能。

问题发现

调用后端接口后，后端会将屏蔽的数据去掉，然后前端再次请求获取剩下的数据刷新页面。
已经封装好了 获取表格数据getData 和 屏蔽数据delData，结果在点击屏蔽按钮后，获取到的数据已经没有那一条记录了，但是页面上的那条记录没有消失。

shieldData() {
	const param ={};
	delData(param).then(res => {
		// 这一步返回值屏蔽成功
		console.log(res);
	})；
	// 重新获取表格数据并渲染到页面
	this.getData();
}

问题分析

请教同事后了解，因为axios请求是异步的，而执行时是先执行完同步，再执行异步，所以上面的代码实际执行顺序是：getData() -> delData

问题解决

异步的问题，要让getData再delData执行之后，将getData放到delData.then()中。

shieldData() {
	const param ={};
	delData(param).then(res => {
		// 这一步返回值屏蔽成功
		console.log(res);
		// 重新获取表格数据并渲染到页面
		this.getData();
	})；
}

总结

注意异步的执行顺序，后执行的放到.then()中去。