Cuando el usuario hace clic en el elemento de la casilla de verificación, debe agregarse a la matriz. Cuando no está marcado, debe eliminarse de la lista de matrices. condiciones: Mantenga la matriz en el objeto de estado que contiene el tipo de empleo de los elementos de entrada de la casilla de verificación marcada 1. Siempre que se marque la casilla de verificación de entrada del tipo de empleo, la identificación del tipo de empleo respectivo debe estar presente en la matriz 2. Y siempre que la casilla de verificación de entrada del tipo de empleo está desmarcado, ese ID de tipo de empleo respectivo debe eliminarse de la matriz 3. Forme la cadena usando join() y use esa cadena como un parámetro de consulta en el código de jobsApiUrl:

 const employmentTypesList = [ {label: 'Full Time', employmentTypeId: 'FULLTIME', }, { label: 'Part Time', employmentTypeId: 'PARTTIME', }, { label: 'Freelance', employmentTypeId: 'FREELANCE', }, { label: 'Internship', employmentTypeId: 'INTERNSHIP', }, ] class Jobs extends Component { state = { apiStatus: apiConstantStatus.initial, jobsList: [], searchInput: '', activeEmploymentId: '', activeSalaryId: '', employmentTypeListId: [], } componentDidMount() { this.getJobs() } getJobs = async () => { this.setState({apiStatus: apiConstantStatus.inProgress}) const jwtToken = Cookies.get('jwt_token') const {employmentTypeListId, activeSalaryId, searchInput} = this.state // Need update Here const employmentType = employmentTypeListId.join(',') const apiUrl = `https://apis.ccbp.in/jobs? employment_type=${employmentType}&minimum_package=${activeSalaryId}&search=${searchInput}` const options = { headers: { Authorization: `Bearer ${jwtToken}`, }, method: 'GET', } } } export default Jobs //render method onChangeEmployTypesIds = event => { const {employmentTypeListId} = this.state const isChecked = event.target.checked console.log(isChecked) // add values to array if (isChecked) { this.setState({ employmentTypeListId: [...employmentTypeListId, event.target.value], }) } else { // remove item from array const filtered = employmentTypeListId.filter( eachItem => eachItem !== event.target.value, ) this.setState({employmentTypeListId: filtered}) } } renderEmploymentTypesList = () => { const {activeEmploymentId} = this.state return employmentTypesList.map(empType => ( <li key={empType.employmentTypeId} > <input type="checkbox" className="checkbox-input" id="emp" value={activeEmploymentId} onChange={this.onChangeEmployTypesIds} /> <label htmlFor="emp" className="label-name" value="label"> {empType.label} </label> </li> )) }