Saltar al contenido

JavaScript: ¿Cómo puedo cambiar los nombres de propiedad de los objetos en un array?

este problema se puede resolver de diferentes maneras, por lo tanto te dejamos la respuesta más completa en nuestra opinión.

Solución:

Podrías usar el .map() función para convertir los datos en columns adecuado para usar con react-select.

los .map() La función está disponible en el Array escribe. Crea un nuevo array desde el array lo llama y le permite proporcionar una función que transforma/cambia cada elemento a medida que se copia del original array.

Puedes hacer uso de él de la siguiente manera:

const columns = [
     name: 'OrderNumber', title: 'Order Number' ,
     name: 'strawberry', title: 'Strawberry' ,
     name: 'vanilla', title: 'Vanilla' 
]

const options = columns.map(function(row) 

   // This function defines the "mapping behaviour". name and title 
   // data from each "row" from your columns array is mapped to a 
   // corresponding item in the new "options" array

   return  value : row.name, label : row.title 
)

/*
options will now contain this:
[
     value: 'OrderNumber', label: 'Order Number' ,
     value: 'strawberry', label: 'Strawberry' ,
     value: 'vanilla', label: 'Vanilla' 
];
*/

Para obtener más información, consulte la documentación de MDN para .map()

Si sólo desea cambiar el nombre de la name propiedad a value puedes usar un map y destruir el name propiedad como value y elige el resto.

const columns = [
     name: 'OrderNumber', title: 'Order Number' ,
     name: 'strawberry', title: 'Strawberry' ,
     name: 'vanilla', title: 'Vanilla' 
];

const newColumns = columns.map( item => 
  const  name: value, ...rest  = item;
  return  value, ...rest 
 
);

console.log( newColumns );

Pero, sospecho que querrías esto ya que react-select no funciona (por lo que veo) con title. espera un label apoyo, supongo. Si es así, vaya y cambie todas las propiedades como sugirió @Dacre Denny. Me gustan las funciones de flecha 🙂 Entonces:

const newColumns = columns.map( item =>
  (  value: item.name, label: item.title  )
);

Usar destructuring con la propiedad de cambio de nombre se simplificará.

const options = [
   value: "chocolate", label: "Chocolate" ,
   value: "strawberry", label: "Strawberry" ,
   value: "vanilla", label: "Vanilla" ,
];

const columns = options.map(( value: name, label: title ) => (
  name,
  title,
));

console.log(columns);

valoraciones y comentarios

Recuerda algo, que tienes el privilegio glosar si topaste tu inconveniente justo a tiempo.

¡Haz clic para puntuar esta entrada!
(Votos: 0 Promedio: 0)



Utiliza Nuestro Buscador

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *