diff --git a/src/views/layout/components/Sidebar/FixiOSBug.js b/src/views/layout/components/Sidebar/FixiOSBug.js new file mode 100644 index 0000000000000000000000000000000000000000..5e0a92624dda6767047f8ec67f1315905bc248a6 --- /dev/null +++ b/src/views/layout/components/Sidebar/FixiOSBug.js @@ -0,0 +1,26 @@ +export default { + computed: { + device() { + return this.$store.state.app.device + } + }, + mounted() { + // In order to fix the click on menu on the ios device will trigger the mouseeleave bug + // https://github.com/PanJiaChen/vue-element-admin/issues/1135 + this.fixBugIniOS() + }, + methods: { + fixBugIniOS() { + const $submenu = this.$refs.submenu + if ($submenu) { + const handleMouseleave = $submenu.handleMouseleave + $submenu.handleMouseleave = (e) => { + if (this.device === 'mobile') { + return + } + handleMouseleave(e) + } + } + } + } +} diff --git a/src/views/layout/components/Sidebar/SidebarItem.vue b/src/views/layout/components/Sidebar/SidebarItem.vue index 01401b0925fb8bf386a4b8fce2a534aa6e7a43bf..e3abbd2d2105fbc936f28b7d05741fb3ef75b1f5 100644 --- a/src/views/layout/components/Sidebar/SidebarItem.vue +++ b/src/views/layout/components/Sidebar/SidebarItem.vue @@ -9,7 +9,7 @@ </app-link> </template> - <el-submenu v-else :index="item.name||item.path"> + <el-submenu v-else ref="submenu" :index="item.name||item.path"> <template slot="title"> <item v-if="item.meta" :icon="item.meta.icon" :title="generateTitle(item.meta.title)" /> </template> @@ -40,10 +40,12 @@ import { generateTitle } from '@/utils/i18n' import { validateURL } from '@/utils/validate' import Item from './Item' import AppLink from './Link' +import FixiOSBug from './FixiOSBug' export default { name: 'SidebarItem', components: { Item, AppLink }, + mixins: [FixiOSBug], props: { // route object item: {