vue + vue-resource + element-ui项目中遇到的问题总结

本文总结了在使用vue + vue-resource + element-ui构建的项目中遇到的问题,包括el-table过滤、ie9兼容性、pagination、vue检测变化、el-dialog居中、input背景颜色等问题,并提供了详细的解决方法。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

运营智享遇到的问题(前端)
vue + vue-resource + element-ui + vue-router + node.js + sass 

1. el-table filter tag 使用filter-method处理数据过滤,当该标签下没有数据时标签切换不起作用
  解决: 1.用el-table的filter-change方法处理过滤逻辑,而不用el-table-column的filter-method方法;
        2.filter tag 设置默认值  
          初始化table时, filter-change和filter-method方法都不会调用,所以初始值设置只是改变tag的UI状态,获取不到当前选择的tag值,
          自己设置一个变量tagValue接收tag值,初始化时默认赋值,在将显示的label值相应formatter回显,filter-change时赋值相应的tagValue.
          :filter-value="filterValue" //tag选中状态
  <el-table :data="list" @filter-change="filterChange">
    <el-table-column
      prop="tag"
      :label="tagNameFormatter"
      column-key="instiStatue"
      :filter-multiple="false"
      :filters="instiStatusList"
      :filter-method="filterTag"
      :filtered-value="filteredValue"
      :formatter="statusFormatter"
      filter-placement="bottom">
    </el-table-column>
  </el-table>
  tagNameFormatter(){//标签名格式化
    let label = '';
    for(let i = 0 ; i < this.instiStatusList.length; i++){
      if(this.tagValue == this.instiStatusList[i].value){
        label = this.instiStatusList[i].text;
      }
    }
    return label;
  }
  filterChange(filter){//过滤(tag值改变) el-table方法
    this.filteredValue = [];
    this.filteredValue.push(filter.instiStatus[0]);
    this.tagValue = filter.instiStatus[0];
    this.getList();//查询列表数据
  }
  filterTag(value, row){//过滤(tag值改变) el-table-column方法
  }
  statusFormatter(row, column){//状态格式化
    let label = '';
    for(let i = 0 ; i < this.instiStatusL

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值