मैं NuxtJS के हेड टैग का उपयोग कर रहा हूं। मेरे आवेदन में मेटा टैग अक्सर दोहराए जाते हैं या केवल थोड़ी भिन्नता होती है।

मैं शीर्षक को मिश्रण में पास करना चाहता हूं और फिर आवेदन में सभी पृष्ठों के लिए कोड का पुन: उपयोग करना चाहता हूं। हालांकि, मुझे यकीन नहीं है कि इसे vuejs में कैसे किया जाए। कोई सुझाव?

export const metatags = {
  head () {
    const organization = this.$store.state.loadedData

    const title = 'Classes & Lessons - ' + organization.organization.name + ' ' +
      organization.target_locations[0]

    const description =
      (organization.organization.name
        ? organization.organization.name
        : '') +
      ' is ' +
      (organization.services.length > 0
        ? organization.target_locations[0]
        : '') +
      "'s premier " +
      (organization.services.length > 0
        ? organization.services[0].name
        : '') +
      ' and ' +
      (organization.services.length > 1
        ? organization.services[1].name
        : '') +
      ' training centers'

    const logo = process.env.AMAZONAWS_IMAGE_URL +
      organization.organization.primary_logo_id + '_350.' + organization.organization.logo_extension

    const favicon = logo

    const domain = 'https://' + this.$store.state.domain

    return {
      title,
      meta: [
        {
          name: 'description',
          content: description
        },
        {
          property: 'og:title',
          content: title
        },
        {
          property: 'og:site_name',
          content: organization.organization.name
        },
        {
          property: 'og:description',
          content: description
        },
        {
          property: 'og:image',
          content: logo
        },
        {
          property: 'og:url',
          content: domain
        },
        {
          name: 'twitter:title',
          content: title
        },
        {
          name: 'twitter:description',
          content: description
        },
        {
          name: 'twitter:image',
          content: logo
        }
      ],
      link: [
        { rel: 'canonical', href: domain },
        { rel: 'icon', href: logo },
        { rel: 'shortcut icon', href: logo },
        { rel: 'apple-touch-icon', href: logo },
        { rel: 'icon', type: 'image/x-icon', href: favicon }
      ]
    }
  }
}
1
Rupert 25 पद 2019, 03:10

1 उत्तर

सबसे बढ़िया उत्तर

किसी भी तर्क को सीधे आपकी head() पद्धति में पारित करना संभव नहीं है, लेकिन this है वहाँ उपलब्ध है। इससे कोई फ़र्क नहीं पड़ता कि head() को सीधे पृष्ठ पर परिभाषित किया गया है या मिश्रण का उपयोग किया गया है। बस सुनिश्चित करें कि इसे अलग-अलग पृष्ठों पर ओवरराइड न करें ....

1
Michal Levý 25 पद 2019, 09:46