Vue上的条件渲染模板？

Question

我有一个简单的情况，我想根据窗口宽度值渲染购物车徽章，但是即使windowWidth确实改变了该值，它也总是显示最后一个。请告诉我该怎么办！

    <template v-if="windowWidth>=1024">
                        <div class="nav-user-account"> {{windowWidth}}      
                            <div class="nav-cart nav-cart-box">                                
                                <a href="/cart" rel="nofollow"><span class="text hidden-sm">Cart</span></a>
                                <span class="cart-number" id="nav-cart-num">{{cartItemCount}}</span>
                            </div>
                        </div>
                    </template>
    <template v-if="windowWidth<1024">
                        <a href="#" style="color:#ff6a00" class="icon-cart">
{{windowWidth}} 
                            <i class="fa fa-shopping-cart fa-2x" aria-hidden="true"></i>
                            <span class="cart-num">2</span>
                        </a>
                    </template>
                    <script>
                        import { mapGetters } from 'vuex'
                        export default {
                            data() {
                                return {
                                    windowWidth: window.innerWidth,

                                }
                            },
                            computed: {
                                ...mapGetters('cart', {
                                    cartItemCount: 'getShoppingCartItemsCount'
                                })
                            },

                            mounted() {
                                this.$nextTick(() => {
                                    window.addEventListener('resize', () => {
                                        this.windowWidth= window.innerWidth
                                    });
                                })
                            },
                        }
                    </script>

更新：正如Tony19所指出的，我需要在这2个模板之外的主模板。

<template>
    <div>
<template v-if="windowWidth>=1024">...</template>
<template v-else></template>
</div>
</template>