vue 组件销毁并重置的实现


Posted in Javascript onJanuary 13, 2020

方法1

当数据变更后,通过watch 监听,先去销毁当前的组件,然后再重现渲染。使用 v-if 可以解决这个问题

<template>
  <third-comp v-if="reFresh"/>
</template>
 
<script>
  export default{
    data(){
     return {
        reFresh:true,
        menuTree:[]
      }
    },
    watch:{
       menuTree(){
 
         this.reFresh= false
         this.$nextTick(()=>{
          
          this.reFresh = true
        })
      }
    }
}
</script>

方法2

<template>
 <third-comp :key="menuKey"/>
</template>

<script>
 export default{
   data(){
     return {
        menuKey:1
      }
   },
   watch:{
      menuTree(){

        ++this.menuKey
      }
   }
}
</script>

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
一些Javascript的IE和Firefox(火狐)兼容性的问题总结及常用例子
May 21 Javascript
编程语言JavaScript简介
Oct 16 Javascript
js常用系统函数用法实例分析
Jan 12 Javascript
阿里巴巴技术文章分享 Javascript继承机制的实现
Jan 14 Javascript
jQuery多文件异步上传带进度条实例代码
Aug 16 Javascript
微信小程序使用Socket的实例
Sep 19 Javascript
layer子层给父层页面元素赋值,以达到向父层页面传值的效果实例
Sep 22 Javascript
用vue封装插件并发布到npm的方法步骤
Oct 18 Javascript
Vue微信项目按需授权登录策略实践思路详解
May 07 Javascript
Angular 利用路由跳转到指定页面的指定位置方法
Aug 31 Javascript
一文看懂如何简单实现节流函数和防抖函数
Sep 05 Javascript
微信小程序自定义头部导航栏(组件化)
Nov 15 Javascript
VUE实现自身整体组件销毁的示例代码
Jan 13 #Javascript
微信小程序聊天功能的示例代码
Jan 13 #Javascript
js实现适配移动端的拖动效果
Jan 13 #Javascript
Vue 嵌套路由使用总结(推荐)
Jan 13 #Javascript
优化Vue中date format的性能详解
Jan 13 #Javascript
JS document文档的简单操作完整示例
Jan 13 #Javascript
JavaScript数组排序小程序实现解析
Jan 13 #Javascript
You might like
php cookies中删除的一般赋值方法
2011/05/07 PHP
php无限极分类实现的两种解决方法
2013/04/28 PHP
php在window iis的莫名问题的测试方法
2013/05/14 PHP
php实现paypal 授权登录
2015/05/28 PHP
PHP使用PHPexcel导入导出数据的方法
2015/11/14 PHP
解决jQuery插件tipswindown与hintbox冲突
2010/11/05 Javascript
js变量以及其作用域详解
2020/07/18 Javascript
javascript 使用 NodeList需要注意的问题
2013/03/04 Javascript
js css 实现遮罩层覆盖其他页面元素附图
2014/09/22 Javascript
animate 实现滑动切换效果【实例代码】
2016/05/05 Javascript
javascript this详细介绍
2016/09/19 Javascript
Javascript实现数组中的元素上下移动
2017/04/28 Javascript
NProgress显示顶部进度条效果及使用详解
2019/09/21 Javascript
Vue3 中的数据侦测的实现
2019/10/09 Javascript
微信小程序实现音乐播放页面布局
2020/12/11 Javascript
[50:01]Ti4 冒泡赛第二天 NEWBEE vs Titan
2014/07/15 DOTA
python中的__init__ 、__new__、__call__小结
2014/04/25 Python
在Python的列表中利用remove()方法删除元素的教程
2015/05/21 Python
Python中map,reduce,filter和sorted函数的使用方法
2015/08/17 Python
Python socket网络编程TCP/IP服务器与客户端通信
2017/01/05 Python
python中实现延时回调普通函数示例代码
2017/09/08 Python
解决python报错MemoryError的问题
2018/06/26 Python
Python告诉你木马程序的键盘记录原理
2019/02/02 Python
Python地图绘制实操详解
2019/03/04 Python
Python 根据日志级别打印不同颜色的日志的方法示例
2019/08/08 Python
python调用有道智云API实现文件批量翻译
2020/10/10 Python
解决Python 写文件报错TypeError的问题
2020/10/23 Python
Opencv常见图像格式Data Type及代码实例
2020/11/02 Python
selenium如何定位span元素的实现
2021/01/13 Python
英国领先的汽车轮胎和快速健康中心:Kwik Fit
2017/10/29 全球购物
团日活动总结
2014/04/28 职场文书
医学专业毕业生求职信
2014/06/20 职场文书
荆州古城导游词
2015/02/06 职场文书
2015年银行客户经理工作总结
2015/04/01 职场文书
详解TypeScript中的类型保护
2021/04/29 Javascript
Win2008系统搭建DHCP服务器
2022/06/25 Servers