首页 > 编程语言 > 详细

前端实现筛选功能 == > 整理数组对象字符串方法

时间:2020-04-02 20:05:03      阅读:97      评论:0      收藏:0      [点我收藏+]

栗子: 请求回来的数据格式为 :

data:[

  {

    id:1, time: ‘2020-08-08‘, value:‘搜索内容1‘,

  },

  {

    id:2, time: ‘2020-08-18‘, value:‘搜索内容12‘,

  },

  {

    id:3, time: ‘2020-08-28‘, value:‘搜索内容123‘,

  },

]

1. 前端进行搜索 在input框输入想搜索的文本 栗子 : this.form.search = ‘‘ 在data中实现双向绑定

2. 在搜索完,调用方法, @change = ‘ searchText ‘

3. searchText ( ) {

   // 把请求回来的数组 过滤一遍

  var arr1 = this.data.filter((item)=>{

     return item.value.indexOf(this.from.search) != -1

    // 在数据中 找到返回搜索文字的item项 成新的数组 arr1

  }) }

再把筛选后的数组arr1 赋值给 表格绑定的数组

A indexOf B // js 判断字符串A中是否包含字符串B

Object.values() // 对象的value以数组的形式展示 栗子 [2,‘2020-08-18‘,‘搜索内容1‘]

var arr = new Array(6)

arr[0] = "George"

arr[1] = "John"

arr[2] = "Thomas"

arr[3] = "James"

arr[4] = "Adrew"

arr[5] = "Martin"

arr.slice(2,4) // Thomas James 从start开始 包括start开始截取, end结束 不包括end

arr.splice(2,0,‘新增‘) 从start开始 删除 end个数 再在数组中增加 ‘新增‘ 这一项 数组转字符串

toString() 强转

parseInt() 字符串转数值 number

前端实现筛选功能 == > 整理数组对象字符串方法

原文:https://www.cnblogs.com/howar/p/12622310.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!