skip to Main Content

Am trying to change the social sharing meta tags of my website to the data that is coming from the back-end database through an API call

head: {
// To use "this" in the component, it is necessary to return the object through a function
title: function () {
  return {
    inner: this.title
  }
},
meta: function () {
  return [
     { name: 'description', content: this.meta.description, id: 'desc' },
     { name: 'application-name', content: this.meta.application_name },
    // Twitter
    { name: 'twitter:title', content: this.title },
    // with shorthand
    { n: 'twitter:description', c: this.meta.description },
    // Google+ / Schema.org
    { itemprop: 'name', content: this.meta.application_name },
    { itemprop: 'description', content: this.meta.description },
    // Facebook / Open Graph
    { property: 'fb:app_id', content: '150240095600075' },
    { property: 'og:title', content: this.title },
    // with shorthand
    { p: 'og:image', c: 'http://jekalowa.com/static/favicon.png' }
  ]
}

}

then in my method object

methods: {
getAsyncData: function () {
  var self = this
  window.setTimeout(function () {
    self.title = self.artist.stagename + ' | ' + self.title
    self.meta: function () {
      return [
         { name: 'description', content: this.meta.description, id: 'desc' },
         { name: 'application-name', content: this.meta.application_name },
        // Twitter
        { name: 'twitter:title', content: this.title },
        // with shorthand
        { n: 'twitter:description', c: this.meta.description },
        // Google+ / Schema.org
        { itemprop: 'name', content: this.meta.application_name },
        { itemprop: 'description', content: this.meta.description },
        // Facebook / Open Graph
        { property: 'fb:app_id', content: '150240095600075' },
        { property: 'og:title', content: this.title },
        // with shorthand
        { p: 'og:image', c: 'http://example.com/static/favicon.png' }
      ]
    }
    self.$emit('updateHead')
  }, 3000)
}

}

I want the social sharing meta tags like Facebook, Twitter, LinkedIn and Google+ and other meta tag information of the page to change when the page has been fully rendered(mounted or loaded) since all the information is coming from the back-end database so that when a user shares the page to Facebook, Twitter, LinkedIn and Google+ the image, title, description and information will be that which came from the database.

i get these error when webpack compiles the code:

Parsing error: Unexpected token, expected ;

2

Answers


  1. There does seem to be an issue here I think:

    self.title = self.artist.stagename + ' | ' + self.title
    self.meta: function () {
    

    Don’t you have to say:

    self.meta = function() ... OR { ... } ?
    

    I think there is definitely a syntax error here.

    Login or Signup to reply.
  2. There is a syntax error in your code at self.meta: instead of colon : it should be the equals sign =.

    self.meta = function () {
      return [
       {}
      ]
    }
    
    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search