Is there a way to replace the existing content of a portal container outside the app?

[sattes-faction]

I'm having an app which has a list of items already rendered from the backend. When portal comes into play it appends it's contents below the existing content in the given container. However, I want the existing content to be cleared (this happens when a user clicks a button and the portal becomes active). Is that possible somehow? Here's an example (written out of my head):

<div id="outside-element">
    <p>Hello, I'm already there!</p>
</div>

<div id="app>
<div>

In the vue app I have:

<portal selector="#outside-element">
    <p>Hi, I'm new!</p>
<portal>

And it gives me

<div id="outside-element">
    <p>Hello, I'm already there!</p>
    <div>
       <p>Hi, I'm new!</p>
     </div>
</div>

But what I want is (with or without the additional divs):

<div id="outside-element">
    <div>
       <p>Hi, I'm new!</p>
     </div>
</div>

Is this already possible somehow?

[sattes-faction]

Ah, like always after fiddling around with this for a bit and writing this ticket I found the issue. I was using vue-simple-portal. After switching to portal-vue this works as expected with the MountingPortal component.

Sorry for wasting your time! And thanks for this component :-)