如何在IonButton上应用悬停效果,以便在Ionic-React中打开IonPopover作为工具提示?

fzwojiic  于 2022-12-08  发布在  Ionic
关注(0)|答案(1)|浏览(146)
<IonPopover
 showBackdrop={false}
 cssClass="theme-popover"
 event={popoverState.event}
 isOpen={popoverState.showPopover}
 onDidDismiss={() =>
 setShowPopover({
  showPopover: false,
  event: undefined,
 })
 }
>
   <IonContent class="ion-padding">
     Hello World!
   </IonContent>
</IonPopover>

如何在IonButton上应用悬停效果,以便在Ionic-React中打开IonPopover作为工具提示?

x0fgdtte

x0fgdtte1#

you can use triggerAction="hover" to show popover on hover:

<IonButton id="hover-trigger">Hover Over Me</IonButton>

<IonPopover trigger="hover-trigger" triggerAction="hover">
   <IonContent class="ion-padding">Hello World!</IonContent>
</IonPopover>

See Documentation: ion-popover

相关问题