Estoy tratando de cambiar el valor de los elementos en el objeto selectedItems , pero la función changeSelectedItems siempre establece el nombre de la variable para escribir en lugar del valor de la propiedad 'tipo'. ¿Cómo uso la propiedad de tipo como el nombre del valor?
const [selectedItems, SetselectedItems] = useState({ shirt:'none', pants:'none', hat:'none', }) const changeSelectedItems = (name,type) =>{ SetselectedItems({type:name}) } <div onClick={() =>changeSelectedItems('blue shirt','shirt')}> blue shirt </div> <div onClick={() =>changeSelectedItems('jeans','pants')}> jeans </div> <div onClick={() =>changeSelectedItems('tophat','hat')}> tophat </div>debería ser
const [selectedItems, SetselectedItems] = useState({ shirt:'none', pants:'none', hat:'none', }) const changeSelectedItems = (name,type) =>{ SetselectedItems(selected => ({...selected, [type]:name})) } <div onClick={() =>changeSelectedItems('blue shirt','shirt')}> blue shirt </div> <div onClick={() =>changeSelectedItems('jeans','pants')}> jeans </div> <div onClick={() =>changeSelectedItems('tophat','hat')}> tophat </div>si desea cambiar el estado de una clave específica, hágalo así
SetselectedItems(oldState => ({...oldState, [type]:name})) el operador de propagación ... obtener todos los objetos sin qué clave específica pones el valor
Solo vamos:
const changeSelectedItems = (name,type) =>{ SetselectedItems({...selectedItems, [type]: name }) }Aquí hay información sobre la sintaxis extendida que he usado y puede leer más sobre las propiedades calculadas en este artículo .