小编Vla*_*are的帖子

仅使用一个输入(即全局搜索)搜索对象中的多个属性

我正在尝试仅使用一个文本输入在reactjs 中构建对对象的通用/全局搜索。

我尝试了不同的方法,包括将字符串转换为数组,然后使用它来过滤我的对象。我设法对所有属性进行输入搜索,但当时只有一个。

const data = [
  {
    name:"Italy",
    title:"Best place for Pizza"
  },
  {
    name:"USA",
    title:"It is a federal state"
  }
]
export class MyApp extends React.Component{
  constructor(props){
    super(props);
    this.state = {
      filteredData:[],
      filter:''
    }
    this.handleSearch.bind(this);
  }
  componentDidMount(){
    this.setState({
      filteredData:data
    })
  }

  handleSearch = (e) =>{
    const filter = e.target.value;

    this.setState({
      filter
    })
  }
  render(){
    var filteredData = data;
    var searchValue = this.state.filter;
    filteredData = filteredData.filter(country => {
      return['name', 'title'].some(key =>{
        return country[key].toString().toLowerCase().includes(searchValue)
      })
    })

    return (
      <div>
        <input …
Run Code Online (Sandbox Code Playgroud)

javascript arrays object reactjs

1
推荐指数
1
解决办法
1804
查看次数

标签 统计

arrays ×1

javascript ×1

object ×1

reactjs ×1