Vue 优雅的强制重新渲染子组件
原理:我们通过 :key实现,当key 值变更时,会自动的重新渲染,key的作用主要是为了高效的更新虚拟DOM。代码实现:<template><div><!-- 父组件 --><div><button @click="reLoad">点击重新渲染...
·
原理:
我们通过 :key
实现,当key 值变更时,会自动的重新渲染,key的作用主要是为了高效的更新虚拟DOM。
代码实现:
<template>
<div>
<!-- 父组件 -->
<div>
<button @click="reLoad">点击重新渲染子组件</button>
</div>
<!-- 内容库子组件 -->
<lib-window :key="time" :channelCode="searchChannelCode"></lib-window>
</div>
</template>
<script>
import children from '@/components/parent/children'
export default {
name: 'contentLib',
components: { libWindow },
data () {
return {
time: ''
}
},
methods: {
reLoad () {
this.time = new Date().getTime()
}
}
}
</script>
更多推荐
已为社区贡献6条内容
所有评论(0)