Tengo una selección de una matriz de objetos, pero también envía una matriz y no tengo idea de cómo hacer esto, ¿alguien puede ayudarme?
<p class="ml-2">Perfil</p> <select id="input" class="border-2 p-2 rounded mr-3 mt" v-model="form.perfis.id"> <option v-for="per in perfis" :key="per.id" :value="per.id" > {{ per.descricao }}</option> </select> 'perfis': [ { 'id': '' } ]¿Cómo accedo a esta identificación?
Debe establecer una propiedad de data con el valor predeterminado que desea para la select
Por ejemplo, si desea establecer el valor predeterminado para la select es el segundo elemento perfis selectValue: perfis[1].id
<template> <p class="ml-2">Perfil</p> <select id="input" class="border-2 p-2 rounded mr-3 mt" v-model="selectValue"> <option v-for="per in perfis" :key="per.id" :value="per.id"> {{ per.descricao }} </option> </select> </template> <script> const perfis = [ { id: "1", descricao: "one", }, { id: "2", descricao: "two", }, { id: "3", descricao: "three", }, ]; export default { name: "App", data() { return { perfis, selectValue: perfis[1].id, }; }, }; </script> <style> #app { font-family: Avenir, Helvetica, Arial, sans-serif; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; text-align: center; color: #2c3e50; margin-top: 60px; } </style>Puede acceder a la identificación de v-model por ejemplo: selectedPerfis
<select id="input" class="border-2 p-2 rounded mr-3 mt" v-model="selectedPerfis"> <option v-for="per in perfis" :key="per.id" :value="per.id" > {{ per.description}} </option> </select> data() { return { selectedPerfis: null, perfis: [ { id: '1', description: 'A' }, { id: '2', description: 'B' }, { id: '3', description: 'C' }, ] }; },