下文中的更新操作指对data的值进行更新的操作，在vue中，都会被放入队列异步执行。
解决方案:
1、 使用nextTick来延迟执行show方法（笼统得说，执行所有需要在数据真正更新后的操作
通过上面的分析我们知道，我们的所有的对vue实例的更新操作，都会先被放入一个队列当中，延迟异步执行，这些异步操作，要么是microtask，要么是macrotask（是microtask还是macroktask取决于环境，nextTick的源码中有所体现），根据事件循环机制，先入队列的先执行，所以如果我们在nextTick当中执行操作就会变成这样。
2、 使用setTimeout来延迟执行show方法，原理同上
所以我们的解决方法可以是：
this.name = data.name
setTimeout(() => {
this.$refs.pop.show()
})或者
this.name = data.name
this.$nextTick(() => {
this.$refs.pop.show()
})nextTick的实现原理
其实nextTick的实现原理是挺简单的，简单点说，就是实现异步，通过不同的执行环境，用不同的方式来实现，保证nextTick里面的回调函数能够异步执行。为什么要这么做呢？因为vue对dom的更新也是异步的呀。
下面贴出源码：
/**
* Defer a task to execute it asynchronously.
*/
export const nextTick = (function () {
const callbacks = [] let pending = false
let timerFunc function nextTickHandler () {
pending = false
const copies = callbacks.slice(0)
callbacks.length = 0
for (let i = 0; i < copies.length; i++) {
copies[i]()
}
}
// the nextTick behavior leverages the microtask queue, which can be accessed
// via either native Promise.then or MutationObserver.
// MutationObserver has wider support, however it is seriously bugged in
// UIWebView in iOS >= 9.3.3 when triggered in touch event handlers. It
// completely stops working after triggering a few times... so, if native
// Promise is available, we will use it:
/* istanbul ignore if */
if (typeof Promise !== 'undefined' && isNative(Promise)) {
var p = Promise.resolve()
var logError = err => { console.error(err) }
timerFunc = () => {
p.then(nextTickHandler).catch(logError)
// in problematic UIWebViews, Promise.then doesn't completely break, but
// it can get stuck in a weird state where callbacks are pushed into the
// microtask queue but the queue isn't being flushed, until the browser
// needs to do some other work, e.g. handle a timer. Therefore we can
