À l'aide de l'API de composition Vue.js 3, déclenchez un événement lorsque le composant est affiché

Question

J'ai certains composants dans mon application qui sont affichés/masqués via des boutons et des variables, par exemple v-show="variable", les boutons définissent simplement ces variables sur vrai/faux et je gère ces composants pour un site Web. page, tout comme naviguer sur un site Web sur différentes pages. Ce que je veux, c'est un moyen d'appeler une fonction lorsque le composant est affiché sur la page. Par exemple, je souhaite sélectionner au hasard 2 joueurs pour démarrer une partie. Lorsque le plateau de jeu est affiché, un message ou un avertissement apparaîtra uniquement lorsque le joueur aura 2 ans. L'important est que l'événement se soit produit dans ce cas, et Pas avant. Mon idée est d'avoir une fonction dans la partie script du composant :

function quelque chose() { alert("hello" }

Trouvez ensuite un moyen de dire :

Lorsque le composant est affiché -> if (player == 2) {quelque chose( }

Ce qui me manque, c'est comment déterminer et gérer la partie "quand le composant est affiché". Pour moi, la logique la plus appropriée semble être d'utiliser onMounted, onRendered (j'ai lu que cela ne fonctionne que dans un environnement de développement) et onActivated, mais ils ne semblent pas fonctionner correctement/pas du tout.

Answer 1

J'ai trouvé un moyen. Le problème est que cela fonctionne avec onMounted和v-if结合使用。我正在检查代码，看看是否可以使用v-if而不是v-show，我记得我故意选择使用v-show pour gérer mon composant, mais peut-être que le changer ne sera pas un problème dans ce cas.