this.$modal.confirm('是否确认删除该数据项?').then(() => { return deleteBreakPromiseInfo(formData); }).then(() => { this.getList(); }).catch(() => { }); 加上return会导致下面的.then不会执行 该怎么解决
时间: 2024-04-02 21:03:15 浏览: 17
如果在第一个`.then`块中加上`return`,确实会导致第二个`.then`块不会执行。解决这个问题的一种方法是将第一个`.then`块中的代码移到一个新的函数中,并在该函数中返回一个Promise对象。然后,你可以在第一个`.then`块中调用这个新函数,并继续链式调用`.then`块。例如:
```javascript
this.$modal.confirm('是否确认删除该数据项?').then(() => {
return confirmAndDelete(formData);
}).then(() => {
this.getList();
}).catch(() => { });
function confirmAndDelete(formData) {
return new Promise((resolve, reject) => {
deleteBreakPromiseInfo(formData);
resolve();
});
}
```
这样,无论是否加上`return`,第二个`.then`块都会根据`confirmAndDelete`函数返回的Promise对象来执行。
相关问题
this.$modal.confirm('是否确认删除该数据项?').then(function () { deleteBreakPromiseInfo(formData); }).then(() => { this.getList(); }) .catch(() => { }); 这串代码有什么问题
这段代码有一个问题。在第一个`.then`块中,调用了`deleteBreakPromiseInfo`函数,并且没有返回一个Promise对象。因此,第二个`.then`块不会等待`deleteBreakPromiseInfo`函数执行完成后才执行。正确的写法应该是在`deleteBreakPromiseInfo`函数中返回一个Promise对象,以确保代码按照预期顺序执行。例如:
```javascript
this.$modal.confirm('是否确认删除该数据项?').then(() => {
return deleteBreakPromiseInfo(formData);
}).then(() => {
this.getList();
}).catch(() => { });
```
这样,第二个`.then`块就会等待`deleteBreakPromiseInfo`函数执行完成后才执行。
vue3中实现this.$modal .confirm('是否确认删除用户编号为"' + userIds + '"的数据项?') .then(function () { return delUser(userIds); }) .then(() => { this.getList(); this.$modal.msgSuccess("删除成功"); }) .catch(() => {}); },
在Vue3中,可以通过在全局注册一个名为`$modal`的对象来实现`this.$modal`的功能。具体实现步骤如下:
1. 创建一个名为`modal`的插件,用于在Vue实例中注册`$modal`对象:
```javascript
const modal = {
install(app) {
app.config.globalProperties.$modal = {
confirm(message) {
return new Promise((resolve, reject) => {
if (window.confirm(message)) {
resolve();
} else {
reject();
}
});
},
msgSuccess(message) {
// 实现消息提示功能
}
};
}
};
export default modal;
```
2. 在`main.js`中引入`modal`插件并注册:
```javascript
import { createApp } from 'vue';
import App from './App.vue';
import modal from './plugins/modal';
const app = createApp(App);
app.use(modal);
app.mount('#app');
```
3. 在组件中使用`this.$modal`:
```javascript
export default {
methods: {
deleteUser(userIds) {
this.$modal.confirm('是否确认删除用户编号为"' + userIds + '"的数据项?')
.then(() => {
return delUser(userIds);
})
.then(() => {
this.getList();
this.$modal.msgSuccess("删除成功");
})
.catch(() => {});
}
}
};
```