爲什麼當數據設置爲true時，我的布爾瑪模式不顯示？ （Vue.js）

Question

Vue.js和bulma的新手。我想獲得一個模式彈出的工作，到目前爲止，我這個來自包括在主App.vue文件中的模態分量：

<template lang="pug"> 
    div#app 
    navigation-menu 
    menu-modal 
    transition(name="fade") 
     router-view 
</template> 

我只是想模態顯示，如果該數據被設置爲true這裏（仍在App.vue，腳本標籤中）：

：

export default { 
    name: 'app', 
    components: { 
     NavigationMenu, MenuModal 
    }, 
    data: { 
    showModal: true 
    } 
} 

我試過模板標籤（Vue.js）裏面加入這個

但是，即使showModal在數據中設置爲true，模式也會從頁面中消失。

任何想法如何使數據設置爲真時模態出現，設置爲假時消失？

Answer 1

您在指定一個data屬性，該屬性將工作在單個Vue實例上，但不在Vue組件上。請參閱Beginner Gotchas Page。

您應該指定一個data方法與showModal設置爲true返回一個對象：

data() { 
    return { 
    showModal: true 
    } 
}