iview路由关闭页面触发事件
上代码
这是routers.js文件
beforeCloseName: (-) 设置该字段,则在关闭当前tab页时会去’@/router/before-close.js’里寻找该字段名对应的方法,作为关闭前的钩子函数
{
path: '/XXXX地址',
name: '名称',
meta: {
icon: '图标',
title: '浏览器上翻标题'
},
component: Main,
children: [
{
path: '地址2',
name: '名称2',
meta: {
icon: '图标2',
title: '不想写了',
beforeCloseName: '这是方法名称'
},
component: () => import('@/view/xxx/aaa/ddd.vue')
}
]
},
这是和routers.js文件同有个文件夹下的
before-close.js文件里的部分内容
import { Modal } from 'iview'
const beforeClose = {
我是路由里面的方法名: (resolve) => {
console.log(resolve)
// 将一个数值放入浏览器缓存
window.localStorage.isSave = '0'
Modal.confirm({
title: '你确定要退出吗?',
okText: '这个是确定问题',
cancelText: '这个是取消文字',
onOk: () => {
// 当点击确定对的时候触发
window.localStorage.isSave = '1'
console.log('ok')
resolve(true)
},
onCancel: () => {
console.log('No')
resolve(true)
}
})
}
}
export default beforeClose
表单页 部分内容
// 这个方法怎么用可以去搜
beforeRouteLeave (to, from, next) {
if (window.localStorage.isSave === '1') {
console.log('我保存后退出')
// whetherToQuit 这个值是页面里面定义的一个Boolen值,如果表单验证成功就是true 如果是失败就是false
if (!whetherToQuit){
next(false)
}else {
next()
}
// 调用保存表单的方法
} else {
console.log('我不保存退出')
next()
}
}
以上就是解决iview路由跳转时候页面数据是否保存。