前端通过JavaScript实现 搜索、分页、排序 等功能

• 搜索

    /**
     * 按名称搜索
     * @param array 源数组
     * @param value 搜索的值
     * @returns {*|[]}
     */
    queryList(array, value) {
      let list = []
      list = array.filter(item => {
        return item.name.includes(value)
      })
      return list
    }

• 分页

    /**
     * 分页数据处理
     * @param data [Array] 需要分页的数据
     * @param num [Number] 当前第几页
     * @param size [Number] 每页显示多少条
     */
    getList(array, num, size) {
      let list, start, end
      start = (num - 1) * size
      end = start + size
      list = array.filter((item, index) => {
        return index >= start && index < end
      })
      // 添加序号
      list.forEach((item, index) => {
        item.seq = index + start
      })
      return list
    }

• 排序

    /**
     * 按时间、名称排序
     * @param array [{time:Date},{name:String},{field:String|Number}]
     * @param type
     * @param desc
     * @returns list []
     */
    orderList(array, type, desc) {
      let list = []
      switch (type) {
        case 'time':
          list = array.sort((a, b) => {
            return new Date(a.time).getTime() - new Date(b.time).getTime()
          })
          break
        case 'zh':
          list = array.sort((a, b) => {
            return a.name.localeCompare(b.name)
          })
          break
        default:
          list = array.sort((a, b) => {
            return a.field - b.field
          })
      }
      return !desc ? list : list.reverse()
    }