vant 2 弹出框报错 Uncaught (in promise) cancel

最新推荐文章于 2023-08-28 13:52:20 发布

在知识的海洋里奋力狗刨

最新推荐文章于 2023-08-28 13:52:20 发布

阅读量1.4k

点赞数

分类专栏：踩坑日记文章标签： javascript 前端 vue.js

本文链接：https://blog.csdn.net/nhq2018/article/details/125243932

版权

在Vue CLI 3搭建的项目中，使用Vant 2的Dialog弹出框组件时遇到点击取消按钮报'Uncaught (in promise) cancel'的错误。该错误是因为在调用confirm时没有处理Promise的catch，导致未捕获的异常。为解决此问题，需要在使用confirm方法后添加catch块来捕获并处理可能出现的错误。

摘要由CSDN通过智能技术生成

场景：

vue-cli3 + vant

问题描述

使用了Dialog异步关闭的官方示例, 点击取消时, 控制台报错 Uncaught (in promise) cancel, 不影响一般用户使用, 但是看着不舒服

function beforeClose(action, done) {
   
  if (action === 'confirm') {
   
    setTimeout(done, 1000)

最低0.47元/天解锁文章

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

在知识的海洋里奋力狗刨

关注关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
1
评论
复制链接

分享到 QQ

分享到新浪微博

扫一扫

专栏目录

vant3中vant-image使用lazy-load报错：Uncaught(in promise)TypeError Cannot read property ‘deep‘ of undefined

cabinx的博客

08-30

1704

关于vant3中vant-image使用lazy-load报错：Uncaught (in promise) TypeError: Cannot read property ‘deep’ of undefined解决方案问题描述: vant3中vant-image使用lazy-load出现以下报错： Uncaught (in promise) TypeError: Cannot read property 'deep' of undefined 解决方案: 上述问题的原因在于：vant

uniapp - 解决引入使用vant组件库时出现报错 Module build failed (x) SyntaxError | @import ‘../common/index.css‘；.van

最新发布

高级前端工程师

08-08

3961

uniapp，vantUI，有赞组件库，报错，uniApp适用vant组件库控制台出现一大片报错，解决uniapp项目中使用vant Weapp图标组件报错问题，UniApp中引入VantUI后出现报错@import ‘../common/index.css‘；.van-icon{text-rendering:auto；-webkit-font-smoothi，HbuildX中uniapp引入vant出现的报错：Module，详细解决办法，出错，还是不行，有问题，引入VantUI后，运行发现报错了，怎么办，

1 条评论您还未登录，请先登录后发表或查看评论

控制台报错 Uncaught (in promise) cancel

weixin_49684597的博客

01-21

1214

解决报错 Uncaught (in promise) cancel

Uncaught (in promise) cancel 报错及解决方法

风一样的我们的博客

08-28

3221

this.$alert内置promise方法。当点击确定的时候，会执行.then(()=>{})部分逻辑；同理，当点击取消的时候，就会执行.catch(()=>{})捕获错误的逻辑。如果在该种方式使用的时候，没有进行错误捕获，就会提示该错误。在element中使用messagebox的alert组件时，点击取消可能会提示一条Uncaught (in promise) cancel 错误。经过一番排查摸索，发现错误的原因很简单。该弹窗包含两个按钮，理所应该需要两个事件对应。所以解决办法就是进行错误捕获。

控制台Uncaught (in promise) cancel 报错问题

qq_53114797的博客

04-20

548

这个报错一开始我也很懵逼，因为他也没说具体说是什么问题，也是我在随便点点一些交互的时候发现的这个问题，后面发现这个问题其实是使用ElementUI方法没有定义完全导致的。elementUI有很多dialog的弹出框，都有确认和取消的选型，选型也对应的各个方法，这边就是因为我们定义对应的方法导致这个报错。因此我们需要为这个promise添加一个catch事件，也就是为dialog的方法的取消按钮添加一个事件方法。点击删除，会弹出确认框，点击取消，就会出现该错误。组件时，点击取消可能会提示一条错误。

Uncaught (in promise) cancel

qq_36164225的博客

09-29

331

捕捉不到错误需要catch() ,,,在后面添加上就行。

element Uncaught (in promise) cancel

qq_39797360的博客

12-23

313

this.$confirm() 确认框点击取消时报错:Uncaught (in promise) cancel 解决方法：没有加catch(),加上之后就不会报错了 this.$confirm('确定删除?', '提示', { confirmButtonText: '确定', cancelButtonText: '取消...

报错是最好的学习方法之Uncaught (in promise) undefined

weixin_46736220的博客

10-12

5888

项目场景：在写VueCli项目，用到push时候后台红字报错，虽然问题不大，但是看着碍眼原因分析：找了资料，发现问题来源： Vue-router 3.1.0 版本以上，使用 push 和 replace 进行跳转时控制台会抛出异常，例如 router.push(’/path’) 返回了 promise ，之前的版本没有报错是因为 vue-router 根本没有返回错误信息，所以之前我们一直无法捕获异常。解决：方法一使用的时候用错误拦截 router.push('/path').catch(

Uncaught (in promise) cancel Promise.then (async)

杨咩咩

04-09

3086

vue element项目中，提示框点击取消报错：Uncaught (in promise) cancel Promise.then (async) 解决方案：加.catch(() => {}) this.$confirm(this.$t('message.delete'), this.$t('message.warning'), { confirmButtonTex...

Vue.js前台报Uncaught (in promise) cancel

qq_44405452的博客

07-28

2023

Vue.js前台报Uncaught [in promise cancel]原因：解决方法：原因： this.$confirm方法内置promise方法，所以不能把.catch()去掉（因为取消操作时，无法捕获）解决方法： //弹框提示是否确认修改 let confirmResult = await this.$confirm("确认修改吗？",'提示',{ confirmButtonText: '确定', cancelButton

vue报错Uncaught (in promise) cancel

hyq_07_27的博客

05-11

735

解决： .then(res => {…}) .catch(()=>{});(then之后把catch加上)vue报错Uncaught (in promise) cancel。原因：this.$confirm方法内置promise方法，.catch()不能省略（因为取消操作时，无法捕获）

vue右滑删除报错 Uncaught(in promise) cancel

陌上人如玉，公子世无双

10-02

542

原因点击取消按钮时，报了这个错误，是因为在代码中只写了点击确认后的时间，而点击取消的事件没有写，以至于爆红。解决 .then 后面一定要加上.catch(() =>{ }) ...

Uncaught (in promise) cancel原因:this.$confirm方法内置pormise方法所以不能把.catch()去掉（因为取消操作时，无法捕获）

hearth_b的博客

06-12

966

cancelSponsor(id) { this.$confirm(`确定撤销主办方`, '提示', { confirmButtonText: '确定', cancelButtonText: '取消', type: 'warning' }).then(() => { this.$http({ url: this.$http.adornUrl(`/active/middle

[Elment] Uncaught (in promise) cancel 解决办法

温柔小狼的博客

11-21

1073

使用confirm时，报如下错误： Uncaught (in promise) cancel 效果如下：原因：因为confirm省略了.catch()，从而无法捕获confirm取消的操作。这里.catch()不能省略。解决：添加.catch()，把错误return 出去就行 removeUserById(id) { const confirmResult = this.$confirm('此操作将永久删除该用户, 是否继续?', '提示', { confirmButto

Uncaught (in promise) cancel 报错

m0_60611659的博客

05-29

296

【代码】Uncaught (in promise) cancel 报错。

element-ui报错：Uncaught (in promise) cancel