subtirelumihail / react-fullpage

A react implementation of fullpage.js
304 stars 105 forks source link

When using react-fullpage and ScrollToTopOnMount with react-router,the error is '[react-router] Location "/sectionTwo" did not match any routes' #52

Open ZhouYajie opened 6 years ago

ZhouYajie commented 6 years ago

Component's code is the same as the example of your Git ,and also add the ScrollToTopOnMount component.But the browser gives the error "[react-router] Location "/sectionTwo" did not match any routes".

`import React, { Component, PropTypes } from 'react' import {ScrollToTopOnMount, SectionsContainer, Section} from 'react-fullpage';

export default class Cover extends Component { constructor(props) { super(props) this.state = { current: 0, } } render() { const options = { sectionClassName: 'section', anchors: ['sectionOne', 'sectionTwo', 'sectionThree'], scrollBar: false, navigation: true, verticalAlign: false, sectionPaddingTop: '50px', sectionPaddingBottom: '50px', arrowNavigation: true, scrollCallback: (states) => this.setState({current: states.activeSection}) };

const {current} = this.state

return (
  <div className="container">
    <ScrollToTopOnMount />
    <SectionsContainer className="container" {...options}>
      <Section className="custom-section" verticalAlign="true" color="#69D2E7" activeSection={current}>Page 1</Section>
      <Section color="#A7DBD8">Page 2</Section>
      <Section color="#E0E4CC">Page 3</Section>
    </SectionsContainer>
  </div>
)

} }`

520Yanxiaofei commented 6 years ago

你好,这个问题你解决了吗?我也遇到这个问题,挺烦恼,不知怎么解决