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) {
|
onScroll (e) {
|
||||||
const target = (e && e.target) || this.$refs['emoji-groups']
|
const target = (e && e.target) || this.$refs['emoji-groups']
|
||||||
this.updateScrolledClass(target)
|
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) {
|
highlight (key) {
|
||||||
const ref = this.$refs['group-' + key]
|
const ref = this.$refs['group-' + key]
|
||||||
@ -134,6 +146,9 @@ const EmojiPicker = {
|
|||||||
}
|
}
|
||||||
},
|
},
|
||||||
mounted () {
|
mounted () {
|
||||||
|
if (this.defaultGroup) {
|
||||||
|
this.highlight(this.defaultGroup)
|
||||||
|
}
|
||||||
this.initializeLazyLoad()
|
this.initializeLazyLoad()
|
||||||
},
|
},
|
||||||
destroyed () {
|
destroyed () {
|
||||||
@ -152,6 +167,9 @@ const EmojiPicker = {
|
|||||||
allCustomGroups () {
|
allCustomGroups () {
|
||||||
return this.$store.getters.groupedCustomEmojis
|
return this.$store.getters.groupedCustomEmojis
|
||||||
},
|
},
|
||||||
|
defaultGroup () {
|
||||||
|
return Object.keys(this.allCustomGroups)[0]
|
||||||
|
},
|
||||||
allEmojiGroups () {
|
allEmojiGroups () {
|
||||||
const standardEmojis = this.$store.state.instance.emoji || []
|
const standardEmojis = this.$store.state.instance.emoji || []
|
||||||
return Object.entries(this.allCustomGroups)
|
return Object.entries(this.allCustomGroups)
|
||||||
|
Loading…
Reference in New Issue
Block a user