在对象数组中查找数组中的元素

时间:2018-11-22 18:16:50

标签: javascript reactjs

我正在尝试返回在搜索字段中包含值(任何对象中匹配的任何字母)的对象。

我想返回对象数组中的数组与之匹配的对象。

示例:

如果

  

search ='狗'

那我想回来

  

[{{name:Jake,last:DK,tags:['fun','dog','cat']}]

或者

  

search ='a'return [{name:Jake,last:DK,tags:['fun','dog','cat']},{name:John,last:Hop,标签:['无聊','鼠标','陷阱']}]

我的尝试:

this.state = {
search = '',
arr = [{name: Jake, last: DK, tags: ['fun','dog','cat']},
       {name: John, last: Hop, tags: ['boring','mouse','trap']}]
}
//asuming the arr is stored in state
let filteredTag = this.state.arr.filter(obj => {
      if (obj.tags !== undefined) {
      return (
        obj.tags.filter(tag => {
          return tag.includes(this.state.search)
        })
      )
      }
    })

我也有

  

if(obj.tags!==未定义){

因为它是单击按钮时出现的列表,并且在页面呈现时最初是未定义的。

5 个答案:

答案 0 :(得分:1)

filter的返回值应为true / false,具体取决于您是否想要特定的元素。记住这一点,您需要进行以下更改。

let filteredTag = this.state.arr.filter(obj => {
  if (obj.tags !== undefined) {
  return (
    obj.tags.filter(tag => {
      return tag.includes(this.state.tagSearch)
    }).length > 0 // since if tag has any element matching,filtered tags length can be checked
  )
  }
  return false // since in undefined case,search condition is not met.
})

答案 1 :(得分:0)

您需要在true的回调函数中返回falsefilter。例如,student.tags.filter(具有正确的回调函数,因为它返回true或false。但是,this.state.arr.filter(obj => {不返回布尔值。更改方法如下:

//asuming the arr is stored in state
let filteredTag = this.state.arr.filter(obj => {
    if (obj.tags === undefined) return false;
    var result = student.tags.filter(tag => {
       return tag.includes(this.state.tagSearch)
    });
    return result.length > 0;
})

答案 2 :(得分:0)

您可以结合使用filtersome来查找所有具有与搜索项“匹配”的标签的对象(匹配定义为tag.includes(term)):

function search(term, arr) {
  return (arr || []).filter(e => (e.tags || []).some(t => t.includes(term)));
}

var data = [{
    name: 'Jake',
    last: 'DK',
    tags: ['fun', 'dog', 'cat']
  },
  {
    name: 'John',
    last: 'Hop',
    tags: ['boring', 'mouse', 'trap']
  }
];

console.log(search('dog', data));
console.log(search('a', data));
console.log(search('dog', undefined));

答案 3 :(得分:0)

如果您只想查找整个术语,这将很简单。由于还希望查找部分术语,因此需要查看每个标签。 some()确实非常有用,因为您可以设置条件,并且返回一个布尔值,这就是您在这里需要的:

let arr = [{name: 'Jake', last: 'DK', tags: ['fun','dog','cat']},
           {name: 'John', last: 'Hop', tags: ['boring','mouse','trap']}]

let term = 'dog'
let found = arr.filter(item => 
  /* return a boolean here */
  /* && will short circuit returning false if there's no tags */
  /* some will return true if any word contains term */
  item.tags && item.tags.some(word => word.includes(term))
)
console.log(found)

// also works with `a`

term = 'a'
found = arr.filter(item => 
  item.tags && item.tags.some(word => word.includes(term))
)
console.log(found)

答案 4 :(得分:0)

在此方法中,您返回许多具有相同标签的元素:

var arr = [{name: 'Jake', last: 'DK', tags: ['fun','dog','cat']},
           {name: 'John', last: 'Hop', tags: ['boring','mouse','trap']},
			{name: 'Demian', last: 'Bibiano', tags: ['dog','cat','trap']}];

function search(searchText){
	var ret = [] 
	arr.forEach(function (element){	
		if(element.tags.includes(searchText)){
			ret.push(element)
        }
	})
	return ret;
}

console.log(search("dog"));