j'ai commencé un projet avec un modèle d'onglets qui a ensuite été décidé d'ajouter un menu latéral. le problème est que le menu latéral n'apparaît pas du tout. voici mon app.components.html ressemble
<ion-app>
<ion-split-pane>
<ion-menu side="start">
<ion-header translucent>
<ion-toolbar color="secondary">
<ion-title>Menu</ion-title>
</ion-toolbar>
</ion-header>
<ion-content><ion-list><ion-item>he vik</ion-item></ion-list></ion-content>
</ion-menu>
<ion-router-outlet></ion-router-outlet>
</ion-split-pane>
</ion-app>
en fait, après avoir survolé au-dessus de ma page actuelle, une brève seconde s'affiche et une page blanche apparaît pour cette raison.
je vois une erreur dans la console
sz7tok82.entry.js:5 Menu: must have a "content" element to listen for drag events on.
mais j'ai déjà l'élément de contenu.
Sirius2013 est correct, vous devrez utiliser l'attribut contentId . Voir un exemple de travail ci-dessous:
App.component.html
<ion-app>
<ion-menu contentId="content1" side="start">
<ion-header>
<ion-toolbar>
<ion-title>Menu</ion-title>
</ion-toolbar>
</ion-header>
<ion-content>
menu stuff
</ion-content>
</ion-menu>
<ion-router-outlet id="content1" main></ion-router-outlet>
</ion-app>
AnyPage.html
Dans la page où vous souhaitez afficher votre menu latéral, vous pouvez utiliser la balise ion-menu-menu .
Voir cet exemple:
<ion-header>
<ion-toolbar>
<ion-title>Page Title</ion-title>
<ion-buttons slot="start">
<ion-menu-button autoHide="false"></ion-menu-button>
</ion-buttons>
</ion-toolbar>
</ion-header>
Définissez la balise autoHide sur false afin de toujours voir le bouton de menu.
<ion-menu>
<ion-header>
<ion-toolbar>
<ion-title>Menu</ion-title>
</ion-toolbar>
</ion-header>
</ion-menu>
<ion-router-outlet main></ion-router-outlet>
https://beta.ionicframework.com/docs/api/menu
Essayez d'utiliser l'attribut contentId.