How to display the value of a variable,-CodePudding

Get data from collection:

const pageTitles = {
    homePage: 'Main'
...
  }
export default pageTitles

if i make all by this way:

<div><span>{{pageTitles.homePage}}</span></div>

everything is ok. But i need show value depending on route. I tried to make this:

pageTitle(){
      if (this.$route.path === '/'){        
        return pageTitles.homePage
      }
    }

and in div i have {{pageTitle}}, but it doesn't work. help please, and why it doesn't work?

CodePudding user response：

you've omitted the this keyword before pageTitles.homePage in your computed property

pageTitle(){
      if (this.$route.path === '/'){        
        return this.pageTitles.homePage
      }
    }

CodePudding user response：

It should work, Here you go :

new Vue({
  el: '#app',
  data: {
    pageTitles: {
        homePage: 'Main'
    }
  },
  computed: {
    pageTitle() {
        return this.pageTitles.homePage
    }
  }
})

<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.js"></script>
<div id="app">
  <h2>{{ pageTitle }}</h2>
</div>