// 使用pushUrl和replaceUrl进行跳转页面
@Entry
@Component
struct Index {
build() {
Column() {
Button('跳转Home').onClick(() => {
// pushUrl 跳转的页面, 可以返回
// replaceUrl 进行跳转页面的, 不能返回, 应用场景: 登录页
router.pushUrl({url: 'pages/Home'})
})
}
}
}
// 路由模式
1. Standard: 无论之前是否添加过,一直添加到页面栈(默认常用)
2. Single:如果目标页面已存在,会将已有的最近同url页面移到栈顶(看情况使用,场景:来回跳转两个页面)
用法:router.pushUrl({url: 'pages/Home'}, router.RouterMode.Single)
// 路由传参
import router from '@ohos.router';
@Entry
@Component
struct Index {
@State value: string = '';
build() {
Column() {
TextInput({placeholder: '请输入', text: $$this.value})
Button('按钮').onClick(() => {
router.pushUrl({
url: 'pages/Home',
params: {message: this.value}
})
})
}
}
}
import router from '@ohos.router';
interface GetParams {
message: string
}
@Entry
@Component
struct Home {
@State message: string = 'Hello World';
aboutToAppear() :void {
const params = router.getParams() as GetParams;
this.message = params.message;
}
build() {
RelativeContainer() {
Column() {
Text(this.message)
}
}
.height('100%')
.width('100%')
}
}