Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

tag BODY modification #188

Closed
wormen opened this issue Feb 1, 2017 · 7 comments
Closed

tag BODY modification #188

wormen opened this issue Feb 1, 2017 · 7 comments
Labels
2.x

Comments

@wormen
Copy link

wormen commented Feb 1, 2017 •
edited by ghost
Loading

how to modify the tag BODY?
as described in the documentation https://github.com/declandewet/vue-meta
changes are not applied

This question is available on Nuxt.js community (#c158)
@atinux
Copy link
Member

atinux commented Feb 1, 2017 via email

@wormen
Copy link
Author

wormen commented Feb 1, 2017

@atinux

<body class="home-page home page page-id-4 page-template page-template-template-homepage page-template-template-homepage-php">

@atinux
Copy link
Member

atinux commented Feb 2, 2017 

<script>
export default {
  head: {
    bodyAttrs: {
      class: 'home-page home page page-id-4 page-template page-template-template-homepage page-template-template-homepage-php'
    }
  }
}
</script>

Please read nuxt documentation

@atinux atinux closed this as completed Feb 2, 2017
@proov
Copy link

proov commented Aug 5, 2017 •
edited
Loading

Hello ! This works perfectly thanks @atinux :) However, i'm using some custom page transitions and while page elements are leaving, body classes are removed and replaced only when the new page is done :( There is a small moment where there is no classes at all. You know if there is a way to trigger bodyAttrs: { class } when transition done() is called ?

Thanks 👍

@ChrisRM
Copy link

ChrisRM commented Oct 10, 2017 •
edited
Loading

@proov If you make that head parameter a function it becomes reactive, so whenever your data changes, the meta-data changes. E.g:

export default {
    data () {
        return {
            dataLoaded: false
        }
    },

    head () {
        return {
            bodyAttrs: {
                class: this.dataLoaded ? 'home-page home page page-id-4 page-template page-template-template-homepage page-template-template-homepage-php' : ''
            }
        }
    },

    // fetch data in some hook and set this.dataLoaded to true.
}

@PhilAndrew PhilAndrew mentioned this issue Dec 4, 2017
Closed
valeriosillari added a commit to valeriosillari/zitronenstrasse that referenced this issue Jan 19, 2018
@valeriosillari
set logic for overflow page when we open nav layer. set logic with nu…
5617768 
…xt!!!

nuxt/nuxt#188
@sudhir600
Copy link

@atinux you save my lot of time.. thanks :-)

@lock
Copy link

lock bot commented Nov 2, 2018

This thread has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs.

@lock lock bot locked as resolved and limited conversation to collaborators Nov 2, 2018
@danielroe danielroe added the 2.x label Jan 18, 2023
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Assignees
No one assigned
Labels
2.x
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
6 participants
@ChrisRM @atinux @proov @sudhir600 @wormen @danielroe