el-table
Q:有fixed属性时,无数据时,可能出现底部边框消失的bug
现象:
解决方法:
.el-table__empty-block {border-bottom: 1px solid var(--el-table-border-color);
}
el-collapse 折叠面板
Q:标题上有按钮,内容中有dialog。按钮控制dialog的打开和关闭。面板折叠时,dialog不能正常弹出。
<el-collapse v-model="activeNames"><el-collapse-item title="title" name="1"><template #title>title <el-button type="text" @click.stop="dialogVisible = true">新增</el-button></template><el-dialogtitle="title"v-model="dialogVisible"width="80%":before-close="() => {dialogVisible = false;}"></el-dialog></el-collapse-item>
</el-collapse>const activeNames = ["1"];
const dialogVisible = ref(false);
分析:面板折叠时,.el-collapse-item .el-collapse-item__wrap 的行内样式为 display: none;。el-dialog作为其后代元素,被隐藏了。
解决方案:el-dialog 不作为el-collapse-item的后代元素就可以。
A1:el-dialog 加 append-to-body 属性。
<el-dialog append-to-body></el-dialog>
A2:el-dialog 不嵌套在 el-collapse-item 内部即可。可以并列。
<el-collapse v-model="activeNames"><el-collapse-item title="title" name="1"></el-collapse-item><el-dialog></el-dialog>
</el-collapse>
国际化
Q:[plugin:vite:import-analysis] No known conditions for "./lib/locale/lang/zh-cn" specifier in "element-plus" package
场景:为了使用锚点(2.6.0)功能,升级了element-plus版本(2.3.6 -> 2.6.1),报错。
解决方案:修改中文的引入路径。
原:import zhCn from 'element-plus/lib/locale/lang/zh-cn'
修改为:
import zhCn from 'element-plus/es/locale/lang/zh-cn'
The End.