Element-UI Table过滤器使用详解

Table

  • 过滤器的使用

    基础使用
    Element-UI Table过滤器使用详解_第1张图片
  • 自定义过滤器

    // 时间长忘记vue是有过滤器配置项 以下为 vue 配置项中的过滤器
    filters: {
            // 过滤价格显示
            filterPrice(price) {
            // 注意数据库中数据类型, price.toFixed(2) 如何格式错误,会出现 xx.toFixed Not a function
                return '¥' + parseFloat(price).toFixed(2)
            }
        }
    
    • 需求

      // 实现数据库查询,对价格显示进行格式化操作
      
      渲染
      Element-UI Table过滤器使用详解_第2张图片
    • 数据库数据

      数据库原始数据格式
      Element-UI Table过滤器使用详解_第3张图片
    • 表格使用布局

      布局结构
      Element-UI Table过滤器使用详解_第4张图片

你可能感兴趣的:(SQL,Vue,vue)