1.创建user页面

ionic g page user

ionic提供了用命令生成界面的功能:
在命令行输入ionic g
如下:
PS D:\item\ionic-test> ionic g
? What would you like to generate? (Use arrow keys)
page
component
service
module
class
directive
guard
(Move up and down to reveal more choices)

2.创建按钮

在首页创建一个可以跳转到user页面的按钮

<ion-button  routerLink="/user" color="success" icon-start>User</ion-button>

在这里插入图片描述

3.修改user页面的标题栏

<ion-header>
  <ion-toolbar>
    <ion-buttons slot="start">
      <ion-back-button></ion-back-button>
    </ion-buttons>
    <ion-title>User</ion-title>
  </ion-toolbar>
</ion-header>

在这里插入图片描述
想去掉Back,在ion-back-button上添加属性text=""

<ion-header>
  <ion-toolbar>
    <ion-buttons slot="start">
      <ion-back-button text=""></ion-back-button>
    </ion-buttons>
    <ion-title>User</ion-title>
  </ion-toolbar>
</ion-header>

ion-back-button属性:
text: 返回按钮的文字
color:返回按钮的颜色(“primary”, “secondary”, “tertiary”, “success”, “warning”, “danger”, “light”, “medium”, and “dark”)
defaultHref:默认返回路径(不设置,自动返回上一页)
disabled:返回功能的显示和隐藏
icon:返回按钮的图标

Logo

开源鸿蒙跨平台开发社区汇聚开发者与厂商,共建“一次开发,多端部署”的开源生态,致力于降低跨端开发门槛,推动万物智联创新。

更多推荐