element一些小问题总结

问题:el-dialog加上v-loading会加在整个页面上?

解决:在el-dialog下套一个el-main或其他,将v-loading加在上面即可。
注意:加上el-main后 ,el-dialog自带的页脚区域不显示,需自己手动写

问题:修改el-dialog中el-dialog__body的内边距不生效?

解决:去掉style上的scoped属性或者deep渗透
注意:为了限制只在本页失效,建议在前面加上自定义class

问题:el-dialog中插入vxe-table,vxe-table想要文字超长显示提示::show-overflow-tooltip="true" 无反应?

解决:曲线救国,关闭el-dialog的阴影层。改变el-dialog的z-index

问题:el-dialog上插入图片,图片大图预览不显示?

解决:给图片预览层重新定义z-index,使他层级比dialog高,即可显示。
注意:vue页面中的class不能加scope 否则会失效。

.el-image-viewer__wrapper{
  z-index: 2050 !important;
}

问题:element-ui的el-table动态修改表格展示列,table高度变小问题

解决办法:在更新表格数据后对el-table进行重载

 this.$nextTick(() => {
     this.$refs.tableName.doLayout();
     // el-table添加ref="tableName"
})

问题:提示信息换行

let newDatas = [];
const h = this.$createElement;
for (let i in data.data) {
  newDatas.push(h("p", { class: "fontRed" }, data.data[i]));
}
this.$message({
  type: "error",
  dangerouslyUseHTMLString: true,
  message: h("div", null, newDatas),

你可能感兴趣的:(前端element)