Vue.js 3 Composition API trigger an event when a Component is shown

I have some components in my app that I show/hide through buttons, through variables, like v-show="variable" and the buttons just set those variables true/false, I'm handling those components as webpages, like you browse through a website on different pages. What I'm looking for is a way to call a function only when a component is shown on the page. Like, I have to randomize 2 players to start a match and when the board for the game gets shown, only if the player is 2, a message appears or an alert appears or whatever, the important is the event occurs in that instance, not before. My idea would be to have a function like

function something() { alert("hello"); }

in the script section of the component and then find a way to say

when the component gets shown -> if (player == 2) { something(); }

What I lack is how to determine and handle the "when the component gets shown" part. The most logic to use it seems to me would be onMounted, onRendered (which I read does work only while in dev) and onActivated, but they don't seem to work properly/at all.

I found a way. The problem is: it works with onMounted combined with v-if. I'm checking now the code to see if I can use v-if instead of v-show, I remember I knowingly chose to use v-show to handle my components but maybe in this case it won't hurt to make the change.