vue、elementui、常用组件

1.table表格显示数据时,特定行增加背景颜色

使用table组件的row-style属性,用该属性绑定一个函数,在函数中写自己的判断逻辑,注意,函数的返回值必须是一个对象的形式,然后里面是两个字符串;
cell-style和header-cell-style属性用来设置标题、以及标题对应的该列数据居中对齐

<el-table
          :data="tableData"
          class="mb15"
          :cell-style="{ textAlign: 'center' }"
          :header-cell-style="{textAlign: 'center'}"
          :row-style="tableRowClassName"
        >
        
    tableRowClassName(row, rowIndex) {
      if (row.row.warning == 1 || row.row.warning == "1") {
        return { "background-color": "burlywood" };
      }
      if(row.row.warning == 99 || row.row.warning == "99"){
        return { "background-color": "crimson" };
      }
    }

2.cascader级联显示相关问题

props:用来定义cascader的一些属性,包括懒加载

懒加载:

当点击组件的时候,去查询数据,拿到下拉框展示的数据源;查询的结果都是用Promise对象包装,ElementUI内部会自动对此对象进行处理,并将它显示再组件上(所以不能直接赋值,因为都是异步Promise对象)

出现问题:
因为是懒加载的缘故,所以下拉显示的数据源只有在手动点击的时候才会显示,因而即使给它绑定了值,因为没有数据源的原因,文本框中也不会进行显示,当我们要做编辑这种需要回显的功能时,就需要特殊的处理。
解决办法:
将懒加载的属性设置为false,并手动查询数据源,然后直接给输入框绑定值,就能实现回显的功能了

已标记关键词 清除标记
相关推荐
©️2020 CSDN 皮肤主题: 1024 设计师:白松林 返回首页