multiple unity instances can not be loaded successfully in SPA

[peilion]

I use vue-router in my SPA, and here is my situation.

• Scenario 1 : PageA( unity instance successfully loaded ) -> PageB ( failed to load )
• Scenario 2 : PageA( unity instance successfully loaded ) -> PageC ( a page without using vue-unity-webgl) -> PageB ( successfully loaded )

I made some modifications in the source code as follows, and the instances distributed in multiple pages can be loaded successfully.

I suppose this is because all the unity instance share a fixed id 'unity-container', but i still can not figure out why scenario 2 happened.

<template>
     ...
    <div :id="container_id" v-bind:style="{ width: width + 'px', height: height + 'px' }"></div>
     ...
</template>

  data() {
    return {
       ...
      // a simple random id generator
      container_id: Number(Math.random().toString().substr(3, length) + Date.now()).toString(36)
    }

  mounted() {
      ...
      this.gameInstance = UnityLoader.instantiate(this.container_id, this.src, params)
      ...
  }