React js : Buscador de un objeto o un array

El contenido nos explica como hacer de buscar datos o filtrar el array o un objeto.

Un campo para buscar

<input class="form-control"  value={this.state.text} onChange={(text) => this.filter(text)}/>

Una función para filtrar datos

filter(event){
      var text = event.target.value
      const data = this.state.productoBackup
      const newData = data.filter(function(item){
          const itemData = item.titulo.toUpperCase()
          const textData = text.toUpperCase()
          return itemData.indexOf(textData) > -1
      })
      this.setState({
          producto: newData,
          text: text,
      })
   }

Por si desear buscar mas de un objeto

filter(event){
      var text = event.target.value
      const data = this.state.productoBackup
      const newData = data.filter(function(item){
          const itemDataTitle = item.titulo.toUpperCase()
          const itemDataDescp = item.descripcion.toUpperCase()
          const campo = itemDataTitle+" "+itemDataDescp
          const textData = text.toUpperCase()
          return campo.indexOf(textData) > -1
      })
      this.setState({
          producto: newData,
          text: text,
      })
    }

5 comentarios en «React js : Buscador de un objeto o un array»

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *