lundi 25 octobre 2021

Filtering with checkboxes with useState

I have an array of things

const reportsData = [
    {
      name: 'Walter',
      Laudos: 1,
    },
    {
      name: 'John',
      Laudos: 20,
    },
  ]

Then on my react component, i need that when i click a checkbox, it sets a state that maked my list filter only that name. Like:

const [searchUser, setSearchUser] = useState('')

{reportsData
                .filter((value: any) => {
                  if (searchUser == '') {
                    return value
                  } else if (
                    value.name
                      .toLowerCase()
                      .includes(searchUser.toLowerCase())
                  ) {
                    return value
                  }
                })

then on the checkbox

<input
  type="checkbox"
  checked={john} // just for example
  onChange={john} // just for example
  className="focus:ring-indigo-500 h-4 w-4 text-indigo-600 border-gray-300 rounded"
/>

I need that when i press this one, it changes the searchUser value to 'John'.

Looked many responses in here but every one of them was messy asf or used this.setState instead of the useState.

How could i achieve this?




Aucun commentaire:

Enregistrer un commentaire