Fix scrol->highlight behaviour
Ref: grouped-emoji-picker
This commit is contained in:
parent
8777b6eadd
commit
23edc4f7e2
@ -78,6 +78,18 @@ const EmojiPicker = {
|
||||
onScroll (e) {
|
||||
const target = (e && e.target) || this.$refs['emoji-groups']
|
||||
this.updateScrolledClass(target)
|
||||
this.scrolledGroup(target)
|
||||
},
|
||||
scrolledGroup (target) {
|
||||
const top = target.scrollTop + 5
|
||||
this.$nextTick(() => {
|
||||
this.allEmojiGroups.forEach(group => {
|
||||
const ref = this.$refs['group-' + group.id]
|
||||
if (ref[0].offsetTop <= top) {
|
||||
this.activeGroup = group.id
|
||||
}
|
||||
})
|
||||
})
|
||||
},
|
||||
highlight (key) {
|
||||
const ref = this.$refs['group-' + key]
|
||||
@ -134,6 +146,9 @@ const EmojiPicker = {
|
||||
}
|
||||
},
|
||||
mounted () {
|
||||
if (this.defaultGroup) {
|
||||
this.highlight(this.defaultGroup)
|
||||
}
|
||||
this.initializeLazyLoad()
|
||||
},
|
||||
destroyed () {
|
||||
@ -152,6 +167,9 @@ const EmojiPicker = {
|
||||
allCustomGroups () {
|
||||
return this.$store.getters.groupedCustomEmojis
|
||||
},
|
||||
defaultGroup () {
|
||||
return Object.keys(this.allCustomGroups)[0]
|
||||
},
|
||||
allEmojiGroups () {
|
||||
const standardEmojis = this.$store.state.instance.emoji || []
|
||||
return Object.entries(this.allCustomGroups)
|
||||
|
Loading…
Reference in New Issue
Block a user