diff --git a/package.json b/package.json index 809137013..1805b05f7 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "devextreme-cli", - "version": "1.1.9", + "version": "1.1.10", "description": "DevExtreme CLI", "keywords": [ "devexpress", diff --git a/templates/react/application/src/layouts/side-nav-inner-toolbar/side-nav-inner-toolbar.js b/templates/react/application/src/layouts/side-nav-inner-toolbar/side-nav-inner-toolbar.js index a6f5f1fdf..acb5b35e2 100644 --- a/templates/react/application/src/layouts/side-nav-inner-toolbar/side-nav-inner-toolbar.js +++ b/templates/react/application/src/layouts/side-nav-inner-toolbar/side-nav-inner-toolbar.js @@ -20,6 +20,7 @@ class SideNavInnerToolbar extends React.Component { ...this.drawerConfig }; + this.scrollViewRef = React.createRef(); this.menuPatch = menuPreInitPatch(this); } @@ -53,7 +54,7 @@ class SideNavInnerToolbar extends React.Component { menuToggleEnabled={minMenuSize === 0} toggleMenu={this.toggleMenu} /> - +
{React.Children.map(this.props.children, item => { return item.type !== Footer && item; @@ -124,6 +125,10 @@ class SideNavInnerToolbar extends React.Component { event.stopPropagation(); }; + get scrollView() { + return this.scrollViewRef.current.instance; + } + get drawerConfig() { const isXSmall = sizes()['screen-x-small']; const isLarge = sizes()['screen-large']; @@ -150,6 +155,7 @@ class SideNavInnerToolbar extends React.Component { pointerEvent.preventDefault(); } else { this.props.history.push(path); + this.scrollView.scrollTo(0); } if (this.hideMenuAfterNavigation) { diff --git a/templates/react/application/src/layouts/side-nav-outer-toolbar/side-nav-outer-toolbar.js b/templates/react/application/src/layouts/side-nav-outer-toolbar/side-nav-outer-toolbar.js index c0155e6e8..4365cdaa4 100644 --- a/templates/react/application/src/layouts/side-nav-outer-toolbar/side-nav-outer-toolbar.js +++ b/templates/react/application/src/layouts/side-nav-outer-toolbar/side-nav-outer-toolbar.js @@ -18,6 +18,7 @@ class SideNavOuterToolbar extends React.Component { ...this.drawerConfig }; + this.scrollViewRef = React.createRef(); this.menuPatch = menuPreInitPatch(this); } @@ -55,7 +56,7 @@ class SideNavOuterToolbar extends React.Component { opened={menuOpened} template={'menu'} > - +
{React.Children.map(this.props.children, item => { return item.type !== Footer && item; @@ -104,6 +105,10 @@ class SideNavOuterToolbar extends React.Component { this.setState({ ...this.drawerConfig }); }; + get scrollView() { + return this.scrollViewRef.current.instance; + } + get drawerConfig() { const isXSmall = sizes()['screen-x-small']; const isLarge = sizes()['screen-large']; @@ -130,6 +135,7 @@ class SideNavOuterToolbar extends React.Component { pointerEvent.preventDefault(); } else { this.props.history.push(path); + this.scrollView.scrollTo(0); } if (this.hideMenuAfterNavigation) { diff --git a/templates/vue/application/src/layouts/side-nav-inner-toolbar.vue b/templates/vue/application/src/layouts/side-nav-inner-toolbar.vue index 6e6c3e74f..5546bf694 100644 --- a/templates/vue/application/src/layouts/side-nav-inner-toolbar.vue +++ b/templates/vue/application/src/layouts/side-nav-inner-toolbar.vue @@ -16,7 +16,7 @@ :menu-toggle-enabled="headerMenuTogglerEnabled" :toggle-menu-func="toggleMenu" /> - + @@ -106,6 +106,9 @@ export default { }, headerMenuTogglerEnabled() { return this.isXSmall; + }, + scrollView() { + return this.$refs["scrollViewRef"].instance; } }, watch: { @@ -119,6 +122,7 @@ export default { this.menuOpened = false; this.menuTemporaryOpened = false; } + this.scrollView.scrollTo(0); } }, components: { diff --git a/templates/vue/application/src/layouts/side-nav-outer-toolbar.vue b/templates/vue/application/src/layouts/side-nav-outer-toolbar.vue index 0673cd573..88e666a77 100644 --- a/templates/vue/application/src/layouts/side-nav-outer-toolbar.vue +++ b/templates/vue/application/src/layouts/side-nav-outer-toolbar.vue @@ -17,7 +17,7 @@ :shading="drawerOptions.shaderEnabled" :close-on-outside-click="drawerOptions.closeOnOutsideClick" > - + @@ -85,6 +85,9 @@ export default { }, headerMenuTogglerEnabled() { return this.isXSmall; + }, + scrollView() { + return this.$refs["scrollViewRef"].instance; } }, watch: { @@ -98,6 +101,7 @@ export default { this.menuOpened = false; this.menuTemporaryOpened = false; } + this.scrollView.scrollTo(0); } }, components: {