如何在滚动上隐藏ionic/vue3的标题

Question

我想知道如何通过向下滚动页面来隐藏Ionic中的标题，并在向上滚动时重新显示它。

我试了所有我能在网上找到的东西，但都不适合我

Answer 1

您可以在ion-content上使用Events:

例如:

<template>
<ion-content
:scroll-events="true"
@ionScrollStart="logScrollStart()"
@ionScroll="logScrolling($event)"
@ionScrollEnd="logScrollEnd()">
<h1>Main Content</h1>
<div slot="fixed">
<h1>Fixed Content</h1>
</div>
</ion-content>
</template>
<script>
import { IonContent } from '@ionic/vue';
import { defineComponent } from 'vue';
export default defineComponent({
components: { IonContent }
});
</script>

文档