vue项目elementui刷新页面弹窗问题

bug:每次刷新页面都有这个鬼弹窗。

刚开始以为是自己的代码问题,于是我翻遍了每一行代码,硬是没找出问题。

后来在网上找了些资料,原来是引入的问题。

解决方案:

改一下引入方式即可。

错误姿势

import Vue from 'vue'

import {Button ,
    Form, 
    FormItem, 
    Input, 
    // Message, 
    Container, 
    Header, 
    Aside,
    Main,
    Menu,
    Submenu,
    MenuItemGroup,
    MenuItem,
    Breadcrumb,
    BreadcrumbItem,
    Card,
    Row,
    Col,
    Table,
    TableColumn,
    Switch,
    Tooltip,
    Pagination,
    Dialog,
    MessageBox,
    Upload,
    Icon,
} from 'element-ui';

Vue.use(Button)
Vue.use(Form)
Vue.use(FormItem)
Vue.use(Input)
// Vue.use(Message)
Vue.use(Container)
Vue.use(Header)
Vue.use(Aside)
Vue.use(Main)
Vue.use(Menu)
Vue.use(Submenu)
Vue.use(MenuItemGroup)
Vue.use(MenuItem)
Vue.use(Breadcrumb)
Vue.use(BreadcrumbItem)
Vue.use(Card)
Vue.use(Row)
Vue.use(Col)
Vue.use(Table)
Vue.use(TableColumn)
Vue.use(Switch)
Vue.use(Tooltip)
Vue.use(Pagination)
Vue.use(Dialog)
Vue.use(MessageBox)
Vue.use(Upload)
Vue.use(Icon)
// Vue.prototype.$message = Message;
// Vue.prototype.$confirm = MessageBox.confirm
Vue.component(MessageBox.name, MessageBox);

 正确姿势

import Vue from 'vue'

import {
    Button,
    Form,
    FormItem,
    Input,
    Container,
    Header,
    Aside,
    Main,
    Menu,
    Submenu,
    MenuItemGroup,
    MenuItem,
    Breadcrumb,
    BreadcrumbItem,
    Card,
    Row,
    Col,
    Table,
    TableColumn,
    Switch,
    Tooltip,
    Pagination,
    Dialog,
    MessageBox,
    Upload,
    Icon,
    Message // 引入 Message 组件
  } from 'element-ui';
  
  // 注册组件
  [Button, Form, FormItem, Input, Container, Header, Aside, Main, Menu, Submenu, MenuItemGroup, MenuItem, Breadcrumb, BreadcrumbItem, Card, Row, Col, Table, TableColumn, Switch, Tooltip, Pagination, Dialog, MessageBox, Upload, Icon].forEach(component => {
    Vue.component(component.name, component);
  });
  
  // 注册 MessageBox 和 Message
  Vue.component(MessageBox.name, MessageBox);
  Vue.prototype.$message = Message;

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:/a/640957.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

构建高效AI代理:单代理与多代理架构的策略与挑战

AI代理架构正成为实现复杂任务自动化的关键技术。这些代理不仅需要处理信息、做出决策,还要能够与外部环境进行交互。随着ChatGPT等生成式AI应用的兴起,研究者们开始探索下一代AI应用,其中AI代理的角色愈发重要。单代理架构以其简洁高效的特点…

牛皮!亚信安全《2024国家级攻防演练100+必修高危漏洞合集》.pdf

上次分享了2023攻防演练高危漏洞,获得了很多粉丝的好评。 今天再分享一份由亚信安全服务团队结合自身的“外部攻击面管理”服务能力和专业的红队能力,最新发布的《2024攻防演练必修高危漏洞合集》,一共108页,非常详细&#xff0c…

五分钟部署开源运维平台Spug结合内网穿透实现远程登录管理

文章目录 前言1. Docker安装Spug2 . 本地访问测试3. Linux 安装cpolar4. 配置Spug公网访问地址5. 公网远程访问Spug管理界面6. 固定Spug公网地址 前言 Spug 面向中小型企业设计的轻量级无 Agent 的自动化运维平台,整合了主机管理、主机批量执行、主机在线终端、文件…

【产品经理】输出

引言:        在最近频繁的产品管理职位面试中,我深刻体会到了作为产品经理需要的不仅仅是对市场和技术的敏锐洞察,更多的是在复杂多变的环境中,如何运用沟通、领导力和决策能力来引导产品从概念走向市场。这一系列博客将分享…

RoboMaster机甲大师赛

RoboMaster机甲大师赛 RoboMaster机甲大师赛中部赛区承办方主要赛事:机甲大师高校联盟赛(RMUL,RoboMaster University League)组别概况比赛规则 RoboMaster机甲大师赛中部赛区 昨天现场观看了机甲师中部赛区,感觉很受震撼&#x…

dmanywhere的docker制作

dmanywhere的docker制作 官网地址: http://www.dmanywhere.cn/ 下载相关执行文件。 Dockerfile的默认命名是“Dockerfile”, 在构建镜像时,如果没有指定Dockerfile文件,Docker通常会寻找名为“Dockerfile”的文件 1.Dockerf…

校园二手书交易|基于SprinBoot+vue的校园二手书交易管理系统(源码+数据库+文档)

校园二手书交易管理系统 目录 基于SprinBootvue的校园二手书交易管理系统 一、前言 二、系统设计 三、系统功能设计 1系统功能模块 2管理员功能模块 3 卖家用户功能模块 4 用户功能模块 四、数据库设计 五、核心代码 六、论文参考 七、最新计算机毕设选题推荐 八…

类图的六大关系

类图中的六大关系包括:继承关系、实现关系、关联关系、聚合关系、组合关系和依赖关系。 1. 继承关系 继承是一种类与类之间的关系,表示一种泛化和特化的关系。子类继承父类的特性和行为。 class Animal {void eat() {System.out.println("This an…

Kafka之【存储消息】

数据已经由生产者Producer发送给Kafka集群,当Kafka接收到数据后,会将数据写入本地文件中。 存储组件 Kafka 的消息存储涉及多个关键组件,每个组件在消息的存储和管理过程中扮演着特定的角色。以下是 Kafka 存储消息过程中涉及的主要存储组件及…

解决ModuleNotFoundError: No module named ‘dnnlib‘问题

复现论文采用了大佬的库,这时候运行报错: 尝试采用:pip install dnnlib解决,但下载源中并不包含该依赖。 解决方法: pip install https://github.com/podgorskiy/dnnlib/releases/download/0.0.1/dnnlib-0.0.1-py3-n…

python数据类型之列表

目录 1.创建列表 2.列表基础操作 常用操作 对列表元素顺序随机打乱 列表下标和切片 字符串分割为列表 列表位移 列表切片替换 3.列表内置方法 4.列表排序 简单排序 使用key参数按指定规则排序 二维列表排序 自定义排序规则函数 5.列表排序算法 选择排序 柱状图…

MiniMax Golang2轮面试,期望薪资25K

一面 1、自我介绍 2、简单介绍一下你们成立了这个finance的财务中台之后,整体的服务架构是怎么样的吗? 3、就你提到的预算池项目,展开说说背景,以及解决了怎么样的问题? 4、为什么采用针对T-1订单的异步计算方案&a…

java语言概述和代码的编译

文章目录 前言 一、机器语言 二、汇编语言 三、高级语言 四、编写代码 打印字符串 求前n项和 五、问题及解决 总结 前言 计算机经过了多年的发展,已经诞生了很多编程语言,如早期的汇编语言,basic语言,现在的高级语言C语言java语言…

计算机网络——TCP 协议的三次握手 / 四次挥手

简述 TCP / UDP 协议都是传输层的协议。 UDP 是面向无连接的协议,就是说发送端不在乎消息数据是否传输到接收端了,所以会出现数据丢失的情况,所以可靠性也不高。 TCP 是面向连接的、可靠的、基于字节流的传输层协议。所谓面向连接的&#…

探秘死锁:原理、发生条件及解决方案

探秘死锁:原理、发生条件及解决方案 死锁是多线程编程中常见的一个问题,它会导致程序停止响应,进而影响系统的稳定性和性能。理解死锁的原理、发生条件以及如何预防和解决死锁是编写健壮并发程序的关键。 1. 死锁的定义 死锁是指两个或多个…

Linux--软硬链接

目录 0.文件系统 1.软硬链接 1.1见一下软硬链接 1.2软硬链接的特征 1.3软硬链接是什么,有什么作用(场景) 0.文件系统 Linux--文件系统-CSDN博客 1.软硬链接 1.1见一下软硬链接 1.这是软链接 这个命令在Unix和Linux系统中用于创建一个符号…

SQL刷题笔记day3——第二大值

1题目 我的错误代码: select emp_no,salary from salaries where salary (select salary from salaries group by salary order by salary limit 1,1 ) order by emp_no asc 正确代码: select emp_no,salary from salaries where salary (select sal…

jellyfish安装及使用(Bioinformatics工具-020)

01 背景 基因组survey以测序技术为基础,基于小片段文库的低深度测序,通过K-mer分析,快速获得基因组大小、杂合度、重复序列比例等基本信息,为制定该物种的全基因组de novo测序策略提供有效依据。 jellyfish (水母) 是一个用于快…

Cisco Nexus Leaf上线注册到APIC,并配置带外管理IP操作方法

现场2台Nexus93108交换机需要注册到APIC上,成为Leaf交换机。 在ACI的架构中,所有Leaf节点交换机要连接到SPINE交换机上,我们的spine交换机型号为Nexus 9364 Leaf N93108TC-EX长这样, 前面是48个万兆电口,后面6个端口支持40G或100…

maven打包报错:MalformedInputException: Input length = 1

maven 打包时报错: [ERROR] Failed to execute goal org.apache.maven.plugins:maven-resources-plugin:3.3.1:resources (default-resources) on project ec-work-mes: filtering /Users/ecmaster/svn/ecmaster/ynmk/ynmk-mes/ec-work/ec-work-mes/src/main/resou…