记录一下,程序中使用到的是vue3+element plus,自己在使用el-dropdown时,突然运行之后发现直接整个页面都卡了,一片空白。而且鼠标完全失去作用,在任务管理器中。看到打开对应网站的浏览器一直占着很大的资源。直接导致整个页面,整个程序都卡了,动都动不了,整个程序都崩了。后面是删除对应的代码后重新运行起来才可以的,然后我就拍错,发现是自己看到不看,就复制了一些标签,导致出现这个问题。出现问题的原因如下:
这个是可以正常显示的,注意了,不会导致页面卡死,Dropdown 下拉菜单 | Element Plus (element-plus.org)
<el-dropdown style="margin-left: 15px"
@command="(command: string | number | object) => handleCommand(command, scope.row)">
<el-button size="small" type="primary" plain>》更多</el-button>
<template #dropdown>
<el-dropdown-menu>
<el-dropdown-item command="handleRoleAuth">分配权限</el-dropdown-item>
<el-dropdown-item command="handleRoleAuthssss">分配用户</el-dropdown-item>
</el-dropdown-menu>
</template>
</el-dropdown>
下面这个就会导致页面卡死,以后使用什么,先看官网,不要随随便便就来个复制,而且是看都不带看的。Dropdown 下拉菜单 | Element Plus (element-plus.org)
<el-dropdown style="margin-left: 15px"
@command="(command: string | number | object) => handleCommand(command, scope.row)">
<el-button size="small" type="primary" plain>》更多</el-button>
<template #dropdown>
<el-dropdown-menu>
<el-dropdown-item command="handleRoleAuth">分配权限</el-dropdown-item>
</el-dropdown-menu>
<!-- 这里就是导致页面卡死的罪魁祸首 -->
<el-dropdown-menu>
<el-dropdown-item command="handleRoleAuthssss">分配用户</el-dropdown-item>
</el-dropdown-menu>
</template>
</el-dropdown>
记录这次是为了提醒自己,以后尽量细心一点