下拉选择器自动定位选中项位置
parent
953fc94cb0
commit
69ea40abc0
|
@ -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() {
|
||||||
|
|
|
@ -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(() => {
|
||||||
|
|
Loading…
Reference in New Issue