From 588e11afa0e6e6671519824203fcbf1f0c836b9c Mon Sep 17 00:00:00 2001 From: Pan Date: Thu, 25 Oct 2018 10:40:52 +0800 Subject: [PATCH] fix[TagsView]: fix openMenu boundary display bug --- src/views/layout/components/TagsView.vue | 16 +++++++++++++--- 1 file changed, 13 insertions(+), 3 deletions(-) diff --git a/src/views/layout/components/TagsView.vue b/src/views/layout/components/TagsView.vue index c9413129..c16827b6 100644 --- a/src/views/layout/components/TagsView.vue +++ b/src/views/layout/components/TagsView.vue @@ -121,11 +121,21 @@ export default { this.$router.push('/') }, openMenu(tag, e) { + const menuMinWidth = 105 + const offsetLeft = this.$el.getBoundingClientRect().left // container margin left + const offsetWidth = this.$el.offsetWidth // container width + const maxLeft = offsetWidth - menuMinWidth // left boundary + const left = e.clientX - offsetLeft + 15 // 15: margin right + + if (left > maxLeft) { + this.left = maxLeft + } else { + this.left = left + } + this.top = e.clientY + this.visible = true this.selectedTag = tag - const offsetLeft = this.$el.getBoundingClientRect().left // container margin left - this.left = e.clientX - offsetLeft + 15 // 15: margin right - this.top = e.clientY }, closeMenu() { this.visible = false