vue 页面卡死,点击无反应的问题及解决
作者:落叶无情也算有情 发布时间:2024-04-27 16:04:21
标签:vue,页面卡死,点击,无反应
vue 页面卡死,点击无反应
我在结合element做表单的时候,进入编辑页时,点击切换不生效,但是value值已改变,就是view视图层无反应,感觉页面卡死的样子
我在切换按钮上,绑定的change事件,执行 this.$forceUpdate()强制刷新视图层
vue 项目页面卡死原因排查
问题描述
点击后台管理某一菜单发现直接卡死,没有其他报错信息,整个网页鼠标变为手指状态不能进行任何操作
问题排查
首先是通过注释代码发现问题是出在以下代码中
<basic-container>
<h4>教师指标数据</h4>
<avue-crud ref="crud"
:data="tableData"
:table-loading="tableLoading"
:option="tableOption"
@refresh-change="refreshChange"
@search-change="searchChange">
<template slot-scope="scope"
slot="menu">
<el-button type="text"
icon="el-icon-view"
size="small"
@click="handleView(scope.row,scope.index)">查看
</el-button>
</template>
</avue-crud>
</basic-container>
查看日志输出
锁定到问题是数据展示的data 需要array 但是却拿到了Object
将数据展示方式tableData改为 table:[]数组类型进行展示即可
data:{
return :{
tableData: []
]
}
getList() {
this.tableLoading = true;
this.tableData=[];
fetchList(this.listQuery).then(response => {
console.log("------------------"+response.data.data)
this.tableData.push(response.data.data) ;
this.tableLoading = false
})
},
小结
这里有几个问题
一个是avue 版本兼容的问题 貌似旧版本会兼容这种情况不会出现卡死的问题
大佬修改框架后出现的这个问题
另一个是返回值规范 如果使用表格 最好都返回list数组 不要返回单object类型导致出现类似
来源:https://blog.csdn.net/JackieMing0328/article/details/85790855
0
投稿
猜你喜欢
- 最近研究微信API,发现个非常好用的python库:wxpy。wxpy基于itchat,使用了 Web 微信的通讯协议,实现了微信登录、收发
- 错误Go 语言通过内置的错误接口提供了非常简单的错误处理机制,Error 类型是一个接口类型。type error interface {
- 现在有一个横向的IFRAME,需要通过点击iframe外的一个图片来横向滚动iframe内的一个html页,但又不想让看见iframe的滚动
- 一、参数的定义1、函数的参数在哪里定义在python中定义函数的时候,函数名后面的括号里就是用来定义参数的,如果有多个参数的话,那么参数之间
- # -*- coding:utf-8 -*-__author__ = 'walkskyer'import osimport
- 前言本文通过使用 cpu 版本的 tensorflow 2.4 ,介绍三种方式进行加载和预处理图片数据。这里我们要确保 tensorflow
- Python由于语言的简洁性,让我们以人类思考的方式来写代码,新手更容易上手,老鸟更爱不释手。要写出 Pythonic(优雅的、地道的、整洁
- #-*- coding: UTF-8 -*-'''Created on 2013-12-5@author: good
- sort包简介官方文档Golang的sort包用来排序,二分查找等操作。本文主要介绍sort包里常用的函数,通过实例代码来快速学会使用sor
- 数据保存在csv文件中1.从csv文件中读取数据参数header=None的有无(1)没有header=None——直接将csv表中的第一行
- 有一个表,用户需要在后台操作它,希望能对它动态进行添加删除字段。这个功能也许没有问题,但是它原有插入与更新的两个存储过程,也需要一起修改。因
- 在编程时你一定碰到过时间触发的事件,在VB中有timer控件,而asp中没有, 假如你要不停地查询数据库来等待一个返回结果的话,我想你一定知
- 这两天搞脚本,花费不少时间。Python和Shell都可以获取文本内容,网上许多资料介绍的都不具体。简单的使用Python和Shell写了脚
- 大家知道,mailto是网页设计制作中的一个非常实用的html标签,许多拥有个人网页的朋友都喜欢在网站的醒目位置处写上自己的电子邮件地址,这
- 在Python中解析XML文件也有Dom和Sax两种方式,这里先介绍如何是使用Dom解析XML,这一篇文章是Dom生成XML文件,下一篇文章
- 1 模型定义和TF很像,Pytorch也通过继承父类来搭建模型,同样也是实现两个方法。在TF中是__init__()和
- 首先,我们需要在vue工程中安装video.js相关依赖。npm install --save video.jsnpm install --
- 首先要说明的是,这个标题有点标题党的意思,这个 bug 也存在于 IE8 下,在 IE6 和 IE7 下正常。之前写过两篇关于 I
- 本文实例为大家分享了python实现抖音视频批量下载的具体代码,供大家参考,具体内容如下这里就拿最近很火的抖音视频为例,利用API来实现用户
- 列表降维(python:3.x)之前遇到需要使用列表降维的情况,如:原列表 : [[12,34],[57,86,1],[43,22,7],[