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.

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

When I refresh my page, the fullpage always roll back to the first screen but hash value don't change. #46

Open
dengshasha opened this issue Nov 6, 2017 · 6 comments

Comments

@dengshasha
Copy link

dengshasha commented Nov 6, 2017

Maybe this can solve :
SectionsContainer.js:

constructor(props) {
            super(props);
            this.state = {
                activeSection: props.activeSection,
                scrollingStarted: false,
                sectionScrolledPosition: 0,
                windowHeight: window.innerHeight //modify 0 to window.innerHeight
            };
@ghost
Copy link

ghost commented Nov 8, 2017

I have same issue, but unfortunately, previous code didn't help.

@dengshasha
Copy link
Author

dengshasha commented Nov 9, 2017

@dropsydice I'm sorry, I forget to specify which file I modified.
when I refresh this page:
image
and I modify SectionsContainer.js:

constructor(props) {
            super(props);
            this.state = {
                activeSection: props.activeSection,
                scrollingStarted: false,
                sectionScrolledPosition: 0,
                windowHeight: window.innerHeight //modify 0 to window.innerHeight
            };

I refresh again:
image
would you try again?

@ghost
Copy link

ghost commented Nov 13, 2017

My way of fixing it is calling this method:

componentDidUpdate () {
        setTimeout(this.refs.container._handleResize , 1);
    }

It's scroll to URL anchor when the viewport resizes

@dengshasha
Copy link
Author

It's a good idea!@dropsydice

@dhwrwm
Copy link

dhwrwm commented Mar 30, 2018

Is there a proper fix for this.

@alexandrebodin
Copy link

Hey,

The cleanest way I found is too pass a activeSection prop to the SectionContainer and update it with the scrollCallback the first time it's set.

class Cmp extends React {
  constructor() {
    super();
    this.state = {
      initialActiveSection: null
    };
  }
  onScroll(p) {
    if (this.state.initialActiveSection === null)
      this.setState(() => ({ initialActiveSection: p.activeSection }));
  }
  render() {
    const { initialActiveSection } = this.state;
    return (
      <SectionsContainer
        {...options}
        activeSection={initialActiveSection}
        scrollCallback={this.onScroll}
      />
    );
  }
}

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

3 participants