Skip to content
This repository has been archived by the owner on Dec 5, 2021. It is now read-only.

Meta tags doesn't update on client side page change, used nuxt-link #70

Closed
mahmoudmy opened this issue Sep 6, 2020 · 7 comments
Closed
Assignees
Labels
bug Something isn't working

Comments

@mahmoudmy
Copy link

Hello,
On my site when I go to new page meta tags doesn't update, but when I press F5, It's OK!

@TiagoDanin
Copy link
Owner

I can't reproduce this problem. Could describe how to reproduce

@TiagoDanin TiagoDanin added the bug Something isn't working label Sep 25, 2020
@mahmoudmy
Copy link
Author

Check it here: rondoit.com
For example click on navbar links you see that title doesn't change, but if you refresh that page (F5) it's OK!

@SeverinAlexB
Copy link
Contributor

I encounter the same problem. The title doesn't change on client-side navigation.
In order to make this work, nuxt-seo needs to subscribe to route changes with a Nuxt middleware.

#69 fixed that the title is set at all but this issue is still open.

Short code snippets to reproduce:

// nuxt.config.js

export default {
  seo: {
      name: "My Application",
      title: "Index",
      templateTitle: "%title% - %name%"
  }
}
// pages/index.vue

export default {
  asyncData: function(ctx) {
    ctx.seo({
      title: 'Index',
    })
  }
}
// pages/about.vue

export default {
  asyncData: function(ctx) {
    ctx.seo({
      title: 'About',
    })
  }
}

Navigating from / to /about with nuxt-link will not result in a title change.


Versions

  • nuxt-seo: 1.4.0
  • nuxt: 2.14.6

@TiagoDanin TiagoDanin self-assigned this Sep 26, 2020
@TiagoDanin TiagoDanin added the help wanted Extra attention is needed label Sep 26, 2020
@TiagoDanin TiagoDanin changed the title meta tags doesn't update on client side page change Meta tags doesn't update on client side page change, used nuxt-link Sep 26, 2020
TiagoDanin added a commit that referenced this issue Sep 26, 2020
@TiagoDanin
Copy link
Owner

When SSR is enabled, and new page is open via nuxt-link, vue-meta (Vue.prototype.$meta) return undefined. Fix this in 1.4.1
https://github.com/TiagoDanin/Nuxt-SEO/releases/tag/v1.4.1

Update package to 1.4.1 and replace:

asyncData: function(ctx) {
			ctx.seo({
				name: 'Name app',
				title: 'Home Page',
				templateTitle: '%name% - %title%',
				description: 'Hello World Page'
			})
		}

to

head: function() {
			return this.$seo({
				name: 'Name app',
				title: 'Home Page',
				templateTitle: '%name% - %title%',
				description: 'Hello World Page'
			})
		}

Doc update! https://github.com/TiagoDanin/Nuxt-SEO#nuxt-head-context

@TiagoDanin TiagoDanin removed the help wanted Extra attention is needed label Sep 26, 2020
@TiagoDanin
Copy link
Owner

TiagoDanin commented Sep 26, 2020

@mahmoudmy Only confirm that it has been fixed :)

@mahmoudmy
Copy link
Author

Every thing is fine, thanks a lot 👍

@SeverinAlexB
Copy link
Contributor

Great! That fix took way less code than I thought. Works like a charm.

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
bug Something isn't working
Projects
None yet
Development

No branches or pull requests

3 participants