Vuejs2 为什么总是包含“v-else”模板块？

我有两个组件模板和一个标志

<template v-if="mainPage">
    <div class="col-md-12">
        <h1>1 page</h1>  
    </div>   
</template>
<template v-else>
    <div class="col-md-12">
        <h1>2 page</h1>
    </div>
</template>
export default {
    data () {
        return {
            text : '',
            mainPage: true,
        }
    },

---

但默认包含第二个模板。为什么？

首先，创建vuejs时，每个组件只允许一个根元素，因此如果没有v-else部分，组件将无法工作，除非将模板更改为div，并创建一个父模板：

如果您不想使用v-If，您可以将v-show用作：

但这对模板不起作用。因为vuejs组件中不能有两个模板

<template v-show="mainPage">
    <div class="col-md-12">
        <h1>1 page</h1>  
    </div>   
</template>
<template>
    <div class="col-md-12">
        <h1>2 page</h1>
    </div>
</template>