vue写后台管理系统,有个需求将所有的$message消息提示换成确认框来增强消息提示效果,遇到嵌套过多的情况,出现某些问题

DepartList.vue:573 Uncaught (in promise) TypeError: Cannot read properties of undefined (reading '$confirm') at eval (DepartList.vue:573:1)

正常情况下是

this.$confirm({

title: '消息提示',

content: h => <div style="color:red;">请选择一条记录!</div>,

onOk() {

console.log('OK');

},

onCancel() {

console.log('Cancel');

},

});

这样就ok,其他几种提示情况呢,比如

this.$confirm({

title: '消息提示',

content: h => <div style="color:red;">{res.message}</div>,

onOk:()=> {

console.log('OK');

},

onCancel:()=> {

console.log('Cancel');

},

});

渲染消息的情况,变量这么渲染

报错的那种场景是,有一个确认框了,比如删除,确定删除吗?这是一个确认框,当删除成功以后显示删除成功又是一个确认框来提示消息,嵌套层级过高,this 的上下文没有正确绑定到 Vue 实例上。为了确保 this 的上下文正确,可以使用箭头函数来定义回调函数,这样可以保留外部 this 的上下文。

简单小问题,开发随记%%%%%%%%%%%%

相关推荐
C_心欲无痕4 分钟前
ts - 模板字面量类型与 `keyof` 的魔法组合:`keyof T & `on${string}`使用
linux·运维·开发语言·前端·ubuntu·typescript
Van_captain5 分钟前
rn_for_openharmony常用组件_Tabs选项卡
javascript·开源·harmonyos
赵民勇6 分钟前
ES6中的const用法详解
javascript·es6
一勺菠萝丶9 分钟前
Java 后端想学 Vue,又想写浏览器插件?
java·前端·vue.js
@PHARAOH14 分钟前
HOW - 如何禁用 localstorage
前端·状态模式
霍理迪14 分钟前
CSS布局方式——弹性盒子(flex)
前端·css
Irene199115 分钟前
Vue 3中:setup 函数接收两个重要参数:props 和 context(附:setup 中无法访问 this 详解)
vue.js·setup
念你那丝微笑21 分钟前
uView Plus + Vue3 + TypeScript + UniApp 正确引入 UnoCSS(避坑版)
vue.js·typescript·uni-app
Van_captain24 分钟前
React Native for OpenHarmony Toast 轻提示组件:自动消失的操作反馈
javascript·开源·harmonyos
内存不泄露24 分钟前
基于Spring Boot和Vue的宠物医院管理系统设计与实现
vue.js·spring boot·信息可视化