vue项目获取不到异步数据dom的解决方案

我们都知道在created钩子函数获取异步数据，mounted钩子函数里面获取dom节点，但是如果出现这种情况，你获取的异步数据比mounted钩子函数还要滞后，导致异步数据的dom渲染不出来，那么这种情况怎么解决呢？

第一种方案

为了确保异步数据确实获取到了，我们可以在异步数据获取成功里面的回调写我们的逻辑。

// 以下为伪代码
methods: {
	async getList() {
		await getList() // 这里成功获取异步数据
		this.$nextTick(() => {
			// 这里面写获取异步数据dom的操作逻辑
		})
	}
}

第二种方案

除了在数据获取成功的回调里面我们知道我们确实请求到了异步数据，还有什么方法呢？当然是watch了

watch: {
	list() {
		this.$nextTick(() => {
			// 这里面写获取异步数据dom的操作逻辑
		})
	}
}

第三种方案

我们可以在mounted里面加个延时器，延时几秒钟，这样也能解决大多数异步数据dom的获取问题，但是延时短了，不一定获取到异步数据的dom，延时久了用户体验又不是很好，所以这种方法仅仅作为参考就行。

mounted() {
	setTimeout(() => {
      // 这里面写获取异步数据dom的操作逻辑
    }, 2000);
}

至于为什么要包裹在$nextTick里面是确保vue已经执行完dom更新。