1. 程式人生 > >v-if繫結的元素為什麼事件沒有響應

v-if繫結的元素為什麼事件沒有響應

Vue是一套構建使用者介面的 漸進式框架,入門也比較容易,但在使用過程中卻可能會遇到這樣那樣的問題,今天筆者就將使用中遇到的一個問題記錄於此,希望能幫到遇到類似問題的朋友。

使用場景:

<button  id="test" v-if="check"></button>

<script>

$("#test").click(function(){

//todo

});

</script>

在html中使用v-if來控制該button的顯示,並在js程式碼中繫結該button的click事件,但是不幸的是如果載入時check變數為false,該button就會隱藏,即使後期check變為true而該button又顯示出來,但是test按鈕的click事件卻只有在頁面載入的時候繫結(不幸的是該button沒有在dom中形成而導致事件繫結失敗),所以click事件不會響應,所以使用v-if繫結的事件需要使用另外一種方式來繫結click事件:v-on指令,通過v-on:click=“xx函式”來實現