avue-tabs中 :before-leave 还能用么?如果不能怎么实现点击后拦截

Saber 未结 1 1636
944293943
944293943 剑圣 2020-03-28 21:35

一、该问题的重现步骤是什么?

1. 

<avue-tabs :option="option"

                    v-model="form"

                    @chang="handleChange"

                    @submit="handleSubmit" :before-leave="beforeLeaveTab">avue-tabs>

2. 

methods:{

handleSubmit(form){

console.log(888888888)

this.$message.success(JSON.stringify(form))

},

handleChange (item) {

this.type = item.prop;

},

beforeLeaveTab(){

return this.$confirm('此操作将切换tab页, 是否继续?', '提示', {

confirmButtonText: '确定',

cancelButtonText: '取消',

type: 'warning'

}).then(() => {

this.$message({

type: 'success',

message: '切换成功!可以做一些其他的事情'

});

}).catch(() => {

this.$message({

type: 'success',

message: '取消成功!可以做一些其他的事情'

});

throw new Error("取消成功!");

});

}


// }

}

3.beforeLeaveTab   没有被调到。


二、你期待的结果是什么?实际看到的又是什么?

期待调到beforeLeaveTab 方法,用  reject() 实现点击后拦截跳转。


三、你正在使用的是什么产品,什么版本?在什么操作系统上?

Saber 2.4.0

四、请提供详细的错误堆栈信息,这很重要。

点击无调用到


五、若有更多详细信息,请在下面提供。

尝试使用 handleChange,点击后用this.$refs.tabs.changeTabs(0);重新设置激活的tab.但是 页面是设置成功了,但tab的选中字体仍是点中的不是我指定了跳转去的。


1条回答
提交回复