未捕获ReferenceError:元素Ui Plus中未定义then

Question

我正在使用vue3和element-ui-plus来构建一个项目。

但是当我尝试在element-ui-plus中使用MessageBox时，出现了一个错误Uncaught ReferenceError: then is not defined。

除了MessageBox之外，其他函数都很好用。

这是我的代码。请参考handleDelete函数。

    <script src="../js/vue.js"></script>
    <script src="../plugins/elementui/index.js"></script>
    <script type="text/javascript" src="../js/jquery.min.js"></script>
    <script src="../js/axios-0.18.0.js"></script>
    <script>
        const app ={
            el: '#app',
            data(){
                return {
                    pagination: {
                        currentPage: 1,
                        pageSize: 10,
                        total: 0,
                        queryString: null
                    },

                    formData: {},


                }
            },
            created() {
                this.findPage();
            },
            methods: {
                findPage() {
                    var param = {
                        currentPage: this.pagination.queryString == null ? this.pagination.currentPage : 1,
                        pageSize: this.pagination.pageSize,
                        queryString: this.pagination.queryString
                    };
                    axios.post("/checkitem/findPage.do",param).then(res => {
                        this.pagination.total = res.data.total;
                        this.dataList = res.data.rows;
                    });

                },
                resetForm() {
                    this.formData = {};
                },
                handleDelete(row) {
                    this.$confirm("Do you want to delete the record?","Warning",{
                        confirmButtonText: "Yes",
                        cancelButtonText: "No",
                        type: "warning"
                    }).then(() => {
                        console.log("delete record");
                        axios.get("/checkitem/delete.do?id="+row.id).then(res => {

                        });
                    }).catch(() => {

                    });


                }
            }
        };
        Vue.createApp(app).use(ElementPlus).mount("#app");
<script>

Answer 1

@Oliver你可以试着让你的函数成为async。见下文

async handleDelete(row) {
  try {
      await this.$confirm("Do you want to delete the record?","Warning",{
        confirmButtonText: "Yes",
        cancelButtonText: "No",
        type: "warning"
    })
    console.log("delete record")
    axios.get("/checkitem/delete.do?id="+row.id)
  } catch (error) {
    // handle error
  } finally {
    // something else if you need
  }
})

但问题是，在触发执行删除之前，您是否打算等待用户确认/取消单击？