VUE组件销毁问题，请教！

vue组件销毁问题，使用elementui的tab组件，采用v-for动态渲染tab，在tab里面使用的动态组件渲染页面，但是在关闭这个bat页面的时候，我直接讲tab的for的列表给清空掉，但是内部的动态组件没有销毁，导致我在此显示这个tab页的时候，之前没有销毁的页面也会请求后台，会导致后台被请求多次，请问如何优化，后台只需要tab加载的时候请求一次就行

【相关推荐】

• 这有个类似的问题, 你可以参考下: https://ask.csdn.net/questions/7506362
• 你也可以参考下这篇文章：vue+element项目中多个tabs页调一个接口、多个tabs页调多个接口
• 除此之外, 这篇博客: vue中定时器设置和关闭页面时关闭定时器中的 还有在tab页面加定时器和销毁定时器 部分也许能够解决你的问题, 你可以仔细阅读以下内容或跳转源博客中阅读:
  

  stro() { //主页A
              this.timeClss = setInterval(() => {
                  this.getFirstList()
              }, 5 * 100)
          },
          twosli() {// 主页B
              this.times =  setInterval(() => {
                  this.getThirdList()
              }, 5 * 100)
          },
          clearTime() { // 主页A 清除
              clearInterval(this.timeClss)
          },
          clearcloss() { // 主页B 清除
              clearInterval(this.times)
          },
  

   handleClick(tab, event) { // 每个tab点击切换的函数方法
              if(tab.label == '主页A'){
                  this.getFirstList()
                  this.stro() 
                  this.clearcloss()
              }else if(tab.label == '工单A'){
                  this.getSecList()
                  this.clearTime()
                  this.clearcloss()
              }else if(tab.label == '主页B'){
                  this.getThirdList()
                  this.twosli()
                  this.clearTime()
              }else if(tab.label == '工单B'){
                  this.getFourList()
                  this.clearcloss()
                  this.clearTime()
              }
          }
  

  首先，把定时器和清除定时器的方法分别写成函数方法，然后在handleClick方法中当要切换tab的时候，在不需要的tab选项卡里调用定时器和清除定时器的方法就好了，这个就可以清除或设置定时器了！

如果你已经解决了该问题, 非常希望你能够分享一下解决方案, 写成博客, 将相关链接放在评论区, 以帮助更多的人 ^-^