tengo este estado
this.state = { dropdown1: false, dropdown2: false, dropdown3: false }Quiero acceder a estos menús desplegables en estado usando this.setState pero el número después de 'desplegable' proviene de API
onMaca = (ev) => { this.setState({ dropdown + ev: true }) }Así que quiero que la clave sea dinámica 'desplegable1', por ejemplo.
Gracias por tus respuestas
puede acceder a la propiedad del objeto como este objeto ['nombre de la propiedad']
onMaca = (ev) => { this.state['dropdown' + ev]= true; this.setState({ ...this.state }) }https://codezup.com/add-dynamic-key-to-object-property-in-javascript/
Puede usar cualquiera de estos para establecer la clave dinámicamente. Intentaré actualizar la respuesta con un ejemplo dentro de un tiempo para setState.
El estado es un objeto JS, por lo que puede obtener sus claves como de costumbre, así:
const stateKeys = this.state.keys() Ahora tienes una matriz: [ "dropdown1", "dropdown1", "dropdown1" ]
Una forma de usarlo sería:
const keysMap = statekeys.map(( item, i ) => return { key: item, idx: i, number: item.replace( /dropdown/, '' ) } keysMap se verá así: [ { key: 'dropdown1', idx: 0, number "1" }, { key: 'dropdown1', idx: 1, number "2" }, { key: 'dropdown1', idx: 2, number "3" } ]
Puede consultar keysMap para un dropDownNumber dado así:
let k = keysMap.find( kmap => kmap.key = dropDownNumber )Para establecer el estado del menú desplegable:
this.setState({ k: <whatever> })