vue中通过this.refs操作DOM时报undefined

vue中通过this.refs操作DOM时的注意事项

在axios请求完成时获取获取绑定的ref 为undefined

vue中this.$nextTick()函数的使用

1. Vue 中的 nextTick 涉及到 Vue 中 DOM 的异步更新
2. Vue 实现响应式并不是数据发生变化之后 DOM 立即变化，而是按一定的策略进行 DOM 的更新
3. $nextTick 是在下次 DOM 更新循环结束之后执行延迟回调，在修改数据之后使用 $nextTick，则可以在回调中获取更新后的DOM

axios({
		method: 'get',
		url: 'api',
		params: {
			key: value
		},
		responseType: 'json'
	}).then(response => {
		// 请求成功
	此时在接口成功之后去获取你渲染出来的ref时 是获取不到的 显示为undefined
 	this.refs.key = undefined
    因为axios是异步请求 页面dom还没更新完成 你此时获取的ref 是还没被渲染出来
	解决方案：
	this.$nextTick(function(){
	此时去获取是可以获取到的 	this.refs.key  （注意：如果使用的不是箭头函数，注意此时的this指向）
    })
	}).catch(error => {
		// 请求失败，
	});

注：这是建立ref绑定的DOM是通过vue(v-for)去渲染出来的