mirror/ant-design
1
0
Fork 0
mirror of https://github.com/ant-design/ant-design.git synced 2025-01-19 06:43:16 +08:00
Code Issues Actions 22 Packages Projects Releases Wiki Activity

🐛 Fix scroll to initial anchor on page load and scroll to top on router change.

Browse Source 
chore: Use destroy replace disable.
This commit is contained in:
gxvv 2019-05-16 13:28:23 +08:00
parent 5b8867439a
commit 8539cf6879
1 changed files with 11 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

17
site/theme/template/Content/MainContent.jsx
View File

@ -68,6 +68,7 @@ export default class MainContent extends Component {
componentDidMount() { componentDidMount() {
this.componentDidUpdate(); this.componentDidUpdate();
window.addEventListener('load', this.handleInitialHashOnLoad);
} }
static getDerivedStateFromProps(props, state) { static getDerivedStateFromProps(props, state) {
@ -87,13 +88,21 @@ export default class MainContent extends Component {
this.bindScroller(); this.bindScroller();
} }
if (!window.location.hash && prevLocation.pathname !== location.pathname) { if (!window.location.hash && prevLocation.pathname !== location.pathname) {
document.documentElement.scrollTop = 0; window.scrollTo(0, 0);
} }
// when subMenu not equal // when subMenu not equal
if (get(this.props, 'route.path') !== get(prevProps, 'route.path')) { if (get(this.props, 'route.path') !== get(prevProps, 'route.path')) {
// reset menu OpenKeys // reset menu OpenKeys
this.handleMenuOpenChange(); this.handleMenuOpenChange();
} }
}
componentWillUnmount() {
this.scroller.destroy();
window.removeEventListener('load', this.handleInitialHashOnLoad);
}
handleInitialHashOnLoad() {
setTimeout(() => { setTimeout(() => {
if (!window.location.hash) { if (!window.location.hash) {
return; return;
@ -107,10 +116,6 @@ export default class MainContent extends Component {
}, 0); }, 0);
} }
componentWillUnmount() {
this.scroller.disable();
}
getMenuItems(footerNavIcons = {}) { getMenuItems(footerNavIcons = {}) {
const { themeConfig } = this.props; const { themeConfig } = this.props;
const { const {
@ -165,7 +170,7 @@ export default class MainContent extends Component {
bindScroller() { bindScroller() {
if (this.scroller) { if (this.scroller) {
this.scroller.disable(); this.scroller.destroy();
} }
require('intersection-observer'); // eslint-disable-line require('intersection-observer'); // eslint-disable-line
const scrollama = require('scrollama'); // eslint-disable-line const scrollama = require('scrollama'); // eslint-disable-line