Как тег сценария используется для отдельных страниц в Svelte/Sapper?

Question

Экземпляр импортированной библиотеки ( ScrollMagic) в теге script одной страницы в Sapper, экземпляр сохраняется при переходе на другие страницы.

Я пытался уничтожить его внутри ondestroy, но я не могу ссылаться на переменную, ссылающуюся на экземпляр (созданный oncreate).

Как я могу либо добавить тег script к отдельным страницам, либо уничтожить экземпляр при выходе из страницы?

Answer 1

У вас есть два способа доступа к вещам в ondestroy которые были созданы в oncreate, Во-первых, добавить их в качестве свойств компонента:

<script>
  import ScrollMagic from 'scrollmagic';

  export default {
    oncreate() {
      this.controller = new ScrollMagic.Controller(...);
      this.scene = new ScrollMagic.Scene(...);
    },

    ondestroy() {
      this.controller.destroy();
      this.scene.destroy();
    }
  };
</script>

Во-вторых, использовать this.on("destroy", ...) форма:

<script>
  import ScrollMagic from 'scrollmagic';

  export default {
    oncreate() {
      const controller = new ScrollMagic.Controller(...);
      const scene = new ScrollMagic.Scene(...);

      this.on('destroy', () => {
        controller.destroy();
        scene.destroy();
      });
    }
  };
</script>