ascendingDirectionSort tiene un valor inicial 'verdadero'. Se puede cambiar por lista desplegable. Cuando se cambia, console.log en la función sortData muestra el valor actualizado, pero solo se ejecuta la condición ascendingDirectionSort==true, incluso cuando es falsa.
...Class ...constructor this.state={ ascendingDirectionSort:true } render()... const {ascendingDirectionSort}=this.state const sortData(field)=>{ console.log(ascendingDirectionSort)//true, when ascendingDirectionSort=true and false when = false if(ascendingDirectionSort){ execute1...//always executes console.log(ascendingDirectionSort) }else{ execute2...//doesnt work } } ... <select value = {ascendingDirectionSort} onChange={this.handleChange}> <option value={true}>Ascending</option> <option value={false}>Descending</option> </select> ... handleChange = (event) => { this.setState({ ascendingDirectionSort: event.target.value }); };
<option value={true}>
Mientras pasa valores booleanos a las propiedades de value
, se representarán como atributos HTML y, por lo tanto, se convertirán en cadenas .
if(ascendingDirectionSort){
Está probando la veracidad del valor de esa variable.
true
, "true"
y "false"
son todos valores verdaderos .
Usa cadenas de manera consistente.
this.state={ ascendingDirectionSort:"true" }
y
if(ascendingDirectionSort === "true"){