mirror/naive-ui
2
0
Fork 0
mirror of https://github.com/tusen-ai/naive-ui.git synced 2025-01-30 12:52:43 +08:00
Code Issues Packages Projects Releases Wiki Activity

fix(select-menu): adapt new treemate api

Browse Source
This commit is contained in:
07akioni 2021-05-16 18:46:44 +08:00
parent 2aea017139
commit 89112c0f81
1 changed files with 14 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

22
src/_internal/select-menu/src/SelectMenu.tsx
View File

@ -13,7 +13,7 @@ import {
UnwrapRef, UnwrapRef,
InjectionKey InjectionKey
} from 'vue' } from 'vue'
import { TreeNode } from 'treemate' import { TreeNode, createIndexGetter } from 'treemate'
import { VirtualList, VirtualListRef } from 'vueuc' import { VirtualList, VirtualListRef } from 'vueuc'
import { depx, getPadding, happensIn } from 'seemly' import { depx, getPadding, happensIn } from 'seemly'
import { NEmpty } from '../../../empty' import { NEmpty } from '../../../empty'
@ -124,6 +124,10 @@ export default defineComponent({
const selfRef = ref<HTMLElement | null>(null) const selfRef = ref<HTMLElement | null>(null)
const virtualListRef = ref<VirtualListRef | null>(null) const virtualListRef = ref<VirtualListRef | null>(null)
const scrollbarRef = ref<ScrollbarInst | null>(null) const scrollbarRef = ref<ScrollbarInst | null>(null)
const flattenedNodesRef = computed(() => props.treeMate.getFlattenedNodes())
const fIndexGetterRef = computed(() =>
createIndexGetter(flattenedNodesRef.value)
)
const { treeMate } = props const { treeMate } = props
const pendingNodeRef = ref( const pendingNodeRef = ref(
props.autoPending props.autoPending
@ -140,6 +144,9 @@ export default defineComponent({
treeMate.getFirstAvailableNode() treeMate.getFirstAvailableNode()
: null : null
) )
const defaultScrollIndex = pendingNodeRef.value
? fIndexGetterRef.value(pendingNodeRef.value.key) ?? undefined
: undefined
const itemSizeRef = computed(() => { const itemSizeRef = computed(() => {
return depx(themeRef.value.self[createKey('optionHeight', props.size)]) return depx(themeRef.value.self[createKey('optionHeight', props.size)])
}) })
@ -153,15 +160,12 @@ export default defineComponent({
return new Set<string | number>() return new Set<string | number>()
}) })
const emptyRef = computed(() => { const emptyRef = computed(() => {
const tmNodes = props.treeMate.flattenedNodes const tmNodes = flattenedNodesRef.value
return tmNodes && tmNodes.length === 0 return tmNodes && tmNodes.length === 0
}) })
const styleRef = computed(() => { const styleRef = computed(() => {
return [{ width: formatLength(props.width) }, cssVarsRef.value] return [{ width: formatLength(props.width) }, cssVarsRef.value]
}) })
const flattenedNodesRef = computed(() => {
return props.treeMate.flattenedNodes
})
watch(toRef(props, 'treeMate'), () => { watch(toRef(props, 'treeMate'), () => {
if (props.autoPending) { if (props.autoPending) {
const tmNode = props.treeMate.getFirstAvailableNode() const tmNode = props.treeMate.getFirstAvailableNode()
@ -237,11 +241,13 @@ export default defineComponent({
): void { ): void {
pendingNodeRef.value = tmNode pendingNodeRef.value = tmNode
if (doScroll && tmNode) { if (doScroll && tmNode) {
const fIndex = fIndexGetterRef.value(tmNode.key)
if (fIndex === null) return
if (props.virtualScroll) { if (props.virtualScroll) {
virtualListRef.value?.scrollTo({ index: tmNode.fIndex }) virtualListRef.value?.scrollTo({ index: fIndex })
} else { } else {
scrollbarRef.value?.scrollTo({ scrollbarRef.value?.scrollTo({
index: tmNode.fIndex, index: fIndex,
elSize: itemSizeRef.value elSize: itemSizeRef.value
}) })
} }
@ -327,7 +333,7 @@ export default defineComponent({
virtualListRef, virtualListRef,
scrollbarRef, scrollbarRef,
style: styleRef, style: styleRef,
defaultScrollIndex: pendingNodeRef.value?.fIndex, defaultScrollIndex,
itemSize: itemSizeRef, itemSize: itemSizeRef,
padding: paddingRef, padding: paddingRef,
flattenedNodes: flattenedNodesRef, flattenedNodes: flattenedNodesRef,