fix scroll container find function
This commit is contained in:
		
							parent
							
								
									60ad28cbc7
								
							
						
					
					
						commit
						1f4d211ff7
					
				
					 2 changed files with 8 additions and 9 deletions
				
			
		| 
						 | 
				
			
			@ -93,14 +93,7 @@ const {
 | 
			
		|||
} = defaultStore.reactiveState;
 | 
			
		||||
 | 
			
		||||
const contentEl = $computed(() => props.pagination.pageEl || rootEl);
 | 
			
		||||
const scrollableElement = $computed(() => {
 | 
			
		||||
	if (contentEl) {
 | 
			
		||||
		const container = getScrollContainer(contentEl);
 | 
			
		||||
		return container || contentEl;
 | 
			
		||||
	}
 | 
			
		||||
	return null;
 | 
			
		||||
});
 | 
			
		||||
 | 
			
		||||
const scrollableElement = $computed(() => getScrollContainer(contentEl));
 | 
			
		||||
 | 
			
		||||
const init = async (): Promise<void> => {
 | 
			
		||||
	queue.value = [];
 | 
			
		||||
| 
						 | 
				
			
			
 | 
			
		|||
| 
						 | 
				
			
			@ -2,7 +2,13 @@ type ScrollBehavior = 'auto' | 'smooth' | 'instant';
 | 
			
		|||
 | 
			
		||||
export function getScrollContainer(el: HTMLElement | null): HTMLElement | null {
 | 
			
		||||
	if (el == null || el.tagName === 'HTML') return null;
 | 
			
		||||
	if (el.scrollHeight > el.clientHeight) {
 | 
			
		||||
	const overflow = window.getComputedStyle(el).getPropertyValue('overflow');
 | 
			
		||||
	if (
 | 
			
		||||
		// xとyを個別に指定している場合、`hidden scroll`みたいな値になる
 | 
			
		||||
		overflow.endsWith('scroll') ||
 | 
			
		||||
		overflow.endsWith('auto') ||
 | 
			
		||||
		el.scrollHeight > el.clientHeight
 | 
			
		||||
	) {
 | 
			
		||||
		return el;
 | 
			
		||||
	} else {
 | 
			
		||||
		return getScrollContainer(el.parentElement);
 | 
			
		||||
| 
						 | 
				
			
			
 | 
			
		|||
		Loading…
	
	Add table
		Add a link
		
	
		Reference in a new issue