Clear event listeners before component unmounts

docs/components/contributors.vue

@@ -135,7 +135,9 @@ export default {
  }
 
  xhr.open('GET', url, true)
- xhr.addEventListener('load', onLoad)
+ xhr.addEventListener('load', onLoad, {
+ signal: this.controller?.signal
+ })
  // Initiate the request
  xhr.send()
  },
@@ -248,6 +250,14 @@ export default {
  // Donors are people/organizations with one-time (paid) donations
  this.makeOcRequest(this.processDonors.bind(this), { status: 'paid' })
  }
+ },
+
+ beforeDestroy() {
+ this.controller.abort()
+ },
+
+ created() {
+ this.controller = new window.AbortController()
  }
 }
 </script>

docs/components/quick-links.vue

@@ -52,10 +52,16 @@ export default {
  }
  },
  created() {
- this.$root.$on('docs-set-toc', toc => {
+ const handleDocsSetToc = toc => {
  this.expanded = false
  // Update the TOC content
  this.toc = toc
+ }
+
+ this.$root.$on('docs-set-toc', handleDocsSetToc)
+
+ this.$once('hook:beforeDestroy', () => {
+ this.$root.$off('docs-set-toc', handleDocsSetToc)
  })
  },
  mounted() {

docs/components/toc.vue

@@ -57,8 +57,14 @@ export default {
  }
  },
  created() {
- this.$root.$on('docs-set-toc', toc => {
+ const handleDocsSetToc = toc => {
  this.toc = toc
+ }
+
+ this.$root.$on('docs-set-toc', handleDocsSetToc)
+
+ this.$once('hook:beforeDestroy', () => {
+ this.$root.$off('docs-set-toc', handleDocsSetToc)
  })
  },
  mounted() {