使用Vue.js 3 Composition API，在元件顯示時觸發一個事件

Question

我在我的應用程式中有一些元件，透過按鈕和變數來顯示/隱藏，例如v-show="variable"，按鈕只是將這些變數設為true/false，我將這些元件處理為網頁，就像在不同頁面上瀏覽網站一樣。我想要的是在元件顯示在頁面上時呼叫一個函數的方法。例如，我要隨機選擇2個玩家開始一場比賽，當遊戲的棋盤顯示出來時，只有當玩家是2時，才會出現一條訊息或彈出一個警告，重要的是事件發生在那個實例中，而不是之前。我的想法是在組件的腳本部分有一個函數：

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

然後找到方法來說：

當元件顯示 -> if (player == 2) { something(); }

我缺乏的是如何確定和處理"當組件顯示時"這一部分。對我來說，最合適的邏輯似乎是使用onMounted、onRendered（我讀到它只在開發環境下工作）和onActivated，但它們似乎無法正常工作/根本不工作。

Answer 1

我找到了一個方法。問題是：它與onMounted和v-if結合使用。我正在檢查程式碼，看看是否可以使用v-if而不是v-show，我記得我故意選擇使用v-show來處理我的組件，但也許在這種情況下改變一下不會有問題。