template v-if =「main」，not working with this this。$ route.path.indexOf（'/'）=== 0 in calculated「main」

適用於我的其他路線，如「/ dashboard」等，但出現在所有路線中。我基本上希望這個模板只在url爲「/」時出現。在整個項目中嘗試過，只是梅花不起作用。請幫助和謝謝！任何建議。

<template v-if="main"> 
    <div id="accordion-nav"> 
    <div class="accordion-panels"> 
     <a href="/dashboard">Dashboard <i class="fa fa-caret-right" aria-hidden="true"></i></a> 
    </div> 
    <div class="accordion-panels"> 
     <a href="/shifts">Shifts <i class="fa fa-caret-right" aria-hidden="true"></i></a> 
    </div> 
    <div class="accordion-panels"> 
     <a href="/other">Other <i class="fa fa-caret-right" aria-hidden="true"></i></a> 
    </div> 
    </div> 
</template> 

<script> 
export default { 
    name: 'accordion-nav', 
    computed: { 
    main: function() { 
     return this.$route.path.indexOf('/') === 0 
    } 
    } 
} 
</script> 

<style scoped> 
</style>

來源

2017-07-08 Teoman Kirac

這是一個單獨的組件。你在哪裏使用這個組件？ –

'' –

用於格式化有@VamsiKrishna抱歉，我把它在我sidebar.vue組件。已經嘗試過也沒有運氣。 –

設置在側邊欄組件本身

'<template> 
    <div id="sidebar" class="sidebar" 
    :class="{ isOpen: isOpen }"> 
    <div class="sidebar-opener" 
     @click="toggle">{{openerText}}</div> 
    <accordion-nav v-if="main"></accordion-nav> 
    <accordion></accordion> 
    </div> 
</template>' 

<script> 
export default { 
    data() { 
    return { 

     } 
    }, 
    computed:{ 
     main(){ 
      return this.$route.path === '/' 
     } 
    } 
} 
</script>

的v-if隨着this.$route.path你，等於解決了在您的應用程序的任何組件絕對路徑當前的路由路徑的字符串。所以你可以用它來檢查您是否在根路徑使用：

this.$route.path === '/'

這裏是example fiddle

來源

2017-07-08 11:47:42

謝謝！奇蹟般有效：） –

使用v-if="main"的方法v-if="main()"，而不是計算的財產

methods: { main: function() { return this.$route.path.indexOf('/') === 0 }

方法做這樣複雜的更新速度比計算性能要好得多。計算=懶

來源

2017-07-08 11:44:06 Reiner

感謝Reiner，這也是可能的工作，但是嘗試了Vamsi的第一個問題，因爲問題被要求提供組件。 –

template v-if =「main」，not working with this this。$ route.path.indexOf（'/'）=== 0 in calculated「main」

回答

相關問題