下拉选择器自动定位选中项位置

pull/1050/head
lyswhut 2022-11-09 17:23:27 +08:00
parent 953fc94cb0
commit 69ea40abc0
2 changed files with 10 additions and 2 deletions

View File

@ -52,10 +52,15 @@ export default {
} }
}, },
computed: { computed: {
activeIndex() {
if (this.modelValue == null) return -1
if (!this.itemName) return this.list.indexOf(this.modelValue)
return this.list.findIndex(l => l[this.itemKey] == this.modelValue)
},
label() { label() {
if (this.modelValue == null) return '' if (this.modelValue == null) return ''
if (this.itemName == null) return this.modelValue if (this.itemName == null) return this.modelValue
const item = this.list.find(l => l[this.itemKey] == this.modelValue) const item = this.list[this.activeIndex]
if (!item) return '' if (!item) return ''
return item[this.itemName] return item[this.itemName]
}, },
@ -86,6 +91,9 @@ export default {
this.show = true this.show = true
this.$nextTick(() => { this.$nextTick(() => {
this.listStyles.transform = `scaleY(1) translateY(${this.handleGetOffset()}px)` this.listStyles.transform = `scaleY(1) translateY(${this.handleGetOffset()}px)`
const activeItem = this.$refs.dom_list.children[this.activeIndex]
if (activeItem) this.$refs.dom_list.scrollTop = activeItem.offsetTop - this.$refs.dom_list.clientHeight * 0.38
}) })
}, },
handleGetOffset() { handleGetOffset() {

View File

@ -112,7 +112,7 @@ export default {
const title = computed(() => { const title = computed(() => {
return musicInfo.name return musicInfo.name
? appSetting['download.fileName'].replace('歌名', musicInfo.name).replace('歌手', musicInfo.singer) ? appSetting['download.fileName'].replace('歌名', musicInfo.name).replace('歌手', musicInfo.singer)
: '^-^' : ''
}) })
// onBeforeUnmount(() => { // onBeforeUnmount(() => {