vue.js v-if仍然呈现给页面

Question

我有一个简单的组件在app html上，它连接到

v-if

正如我从文档中理解的那样，如果v-if为false，那么组件就不应该被创建。

这是页面上的组件

<post-modal :v-if="postModal" :show.sync="postModal" :post="post">
    <h3 slot="header">Show Post</h3>
</post-modal>

和应用代码：

new Vue({
    el: '#vueApp',
    data: {
        postModal: false,
        postId: null,
        post: null
    }
});

你可以看到＆＃34; postModal＆＃34;是假的，所以组件不应该被渲染......但是我知道它在组件＆＃34;创建＆＃34;方法我有一个

alert('created');

我做错了什么？

谢谢！

Answer 1

UPD：@PatrickSteele

v-if instead of :v-if directive 

fiddle