當我們在開發一個表單時，經常需要提供一個下拉菜單供用戶選擇。如果我們希望在初始化時默認選中某個選項，可以在option標簽上添加selected屬性。但是如果我們希望在某個事件觸發后動態地選中某個選項，該怎么辦呢？下面我們來介紹使用Vue.js如何實現動態選中option。

首先，我們需要在Vue實例中定義一個數據變量，用于存儲當前選中的選項的值：

data: {
selectedOption: 'option2',
}

接著，在select標簽中綁定該變量：

選項1選項2選項3

這樣，當用戶選擇不同選項時，我們就能通過{{selectedOption}}來獲取當前選中的值。

但是，我們希望在某個事件觸發后，動態地改變選中的值。假設我們有一個按鈕，并希望在點擊該按鈕后選中第一個選項，那么我們可以這樣實現：

選中選項1methods: {
selectOption1() {
this.selectedOption = 'option1';
}
}

當用戶點擊按鈕時，Vue.js會調用selectOption1方法，并將selectedOption變量的值改為'option1'，從而使第一個選項被選中。

除了手動觸發事件外，我們還可以使用Vue.js的計算屬性來動態計算選中的值。例如，假設我們有兩個數據變量selectedOption1和selectedOption2，我們希望將它們的值相加后作為選中的值，可以這樣實現：

data: {
selectedOption1: 'option1',
selectedOption2: 'option2',
},
computed: {
selectedOption() {
return this.selectedOption1 + this.selectedOption2;
}
}

這樣，每當selectedOption1或selectedOption2變化時，Vue.js會重新計算selectedOption，并將其作為選中的值進行展示。

總的來說，使用Vue.js來實現動態選中option非常方便。我們只需要在Vue實例中定義一個數據變量，綁定到select標簽中，并在需要的時候改變它的值即可。同時，Vue.js的計算屬性能夠幫助我們更加靈活地計算選中的值，從而滿足不同的需求。