Me gustaría encontrar una solución que me permitiera usar la función de mapa para extraer propiedades en función de una matriz de propiedades. Idealmente, me gustaría una solución general para no tener que codificar la función de mapa para cada variación.

Mi caso de uso: estoy creando un panel de administración que necesitará mostrar más de 20 tablas, cada una con una combinación diferente de columnas. Usando VueJS, tengo un componente de tabla para representar la tabla, pero actualmente cada tabla tiene exactamente las mismas columnas que se muestran.

 // every table shows these 4 columns this.rows = this.menu.MenuItem.map(r => ({ Id: r.Id, Name: r.Name, Description: r.Description, Category: r.Category }))

En lugar de las mismas columnas para cada tabla, me gustaría que cada tabla pudiera definir qué columnas le gustaría mostrar. El mismo componente de tabla se usa para cada tabla, por lo que necesito una solución general para evitar escribir un bloque if-else masivo.

 const MenuColumnMapping = [ { menu: "Menu 1", columns: ["Id", "Name", "Description"] }, { menu: "Menu 2", columns: ["Id", "Name", "Description", "Category" ] }, { menu: "Menu 3", columns: ["Id", "Name", "Description", "Price", "Condition" ] }, ... ]

¿Cómo podría reescribir la función de map para seleccionar las propiedades en función de la matriz de columns para un menú determinado?

 let cols = MenuColumnMapping .filter((m) => m.menu === this.menu.Name) .map((m) => m.columns) // ex. cols = [ "Id", "Name", "Description", "Category" ] this.rows = this.menu.MenuItem.map(r => ({ // How can I select only the properties listed in cols }))