HarmonyOS开发之路由跳转

---

一、路由跳转模式与实例

跳转模式 有点类似于vue的路由跳转

• router.pushUrl 保留路由栈，保留当前的页面；
• router.replaceUrl 销毁当前页面，跳转一个新的页面 ；
• router.back 返回上个路由栈保存的页面;

跳转实例

• router.RouterMode.Standard 默认模式 压入栈顶；
• router.RouterMode.Single 如果跳转的目标页在路由栈中已经存在，那么就会将距离栈顶最近的url放到栈顶，并重新加载。如果不存在 将按照默认模式执行；

1.router.pushUrl

import router from '@ohos.router'

//跳转到新的页面 保留当前路由栈router.pushUrl({//跳转路径url:'pages/HomePage',//传递参数params:{id:1}},//默认模式router.RouterMode.Standard,(err) => {if(err){console.log('路由失败')}})
})//接取参数
router.getParams()['id']

2.router.replaceUrl

import router from '@ohos.router'

//跳转到新的页面 保留当前路由栈router.replaceUrl ({//跳转路径url:'pages/HomePage',//传递参数params:{id:1}},//默认模式router.RouterMode.Standard,(err) => {if(err){console.log('路由失败')}})
})//接取参数
router.getParams()['id']

3.router.back

import router from '@ohos.router'

    //1、直接返回router.back();//2、返回到指定页面router.back({url: 'pages/Info'});//3、返回到指定页面，并传递自定义参数信息router.back({url: 'pages/Info',params: {id:1}});//4、系统默认返回询问框router.showAlertBeforeBackPage({message:'确定返回到login页面吗？'})router.back()//5、自定义询问框import promptAction from '@ohos.promptAction'promptAction.showDialog({message:'确定返回到login页面吗？',buttons: [{text: '取消',color: '#FF0000'},{text: '确认',color: '#0099FF'}]}).then((result)=>{if(result.index === 0){console.log('点击了取消按钮')}else if(result.index === 1){// 用户点击了“确认”按钮console.log('用户点击了“确认”按钮')// 调用router.back()方法，返回上一个页面router.back();}}).catch(err => {console.error(`Invoke showDialog failed, code is ${err.code}, message is ${err.message}`);})})