解决办法,刷新组件,通过v-if来创建新的组件
<template>
<div>
<group>
<datetime v-model="val" v-if="hackReset"></datetime>
</group>
</div>
</template>
<script>
import { Group, Datetime } from 'vux'
export default {
components: {
Group,
Datetime
},
data () {
return {
val:'',
hackReset: true
}
},
mounted() {
this.hackReset = false,
this.val = '2020-03-15'
this.$nextTick(() => {
this.hackReset = true
})
}
}
</script>
原理
Vue 实现响应式并不是数据发生变化之后 DOM 立即变化,而是按一定的策略进行 DOM 的更新。$nextTick
是在下次 DOM 更新循环结束之后执行延迟回调,在修改数据之后使用 $nextTick
,则可以在回调中获取更新后的 DOM
参考文章:https://www.jianshu.com/p/34cc4acda9ff
参考文章:https://blog.csdn.net/sinat_17775997/article/details/71638144