ionic4 ion-menu

menu效果

1. 在app.component.html中加入需要引入的menu

<ion-app>
    <ion-split-pane contentId="main-content">
        <ion-menu style="--width:65%" contentId="main-content" type="overlay">
            <ion-header>
                <ion-toolbar style="--border-width: 0">
                   <ion-title>标题</ion-title>
                </ion-toolbar>
            </ion-header>
            <ion-content>
            内容
            </ion-content>
        </ion-menu>
        <ion-router-outlet id="main-content"></ion-router-outlet>
    </ion-split-pane>

</ion-app>

2. 在需要引入menu的页面加入menu按钮

 <ion-buttons slot="start">
    <ion-menu-button></ion-menu-button>
 </ion-buttons>