title: JS array of objects with an id and name set to Vuetify select :items so that you select a name and it sets the id as the value
body: <p>I have an array of objects with an id and name:</p>
  
  <pre><code>Teams [
      { id: 1, name: 'team1' },
      { id:2, name: 'team2' } 
  ]
  </code></pre>
  
  <p>Is there a way to pass the names to a vuetify select's items so that when you select a name, you'd set the object's id as the v-model value?: </p>
  
  <pre><code>&lt;v-select
    v-model="???"
    :items="???"
    label="Teams"
  &gt;&lt;/v-select&gt;
  </code></pre>
  
  <p>I'm guessing this would be in the created method, but not really sure where to even start. Right now, I am setting an empty teams array to the teams that are in the store on the app's initial fetch:</p>
  
  <pre><code>this.teams = this.$store.state.teams.teams
  </code></pre>
  
  <p>I'm getting this as a collection from the laravel backend, so I was contemplating transforming to an id: name key value pair there, but that's seems unnecessary. As it is, I'm just doing the most best eloquent query in the index method of my resource controller: </p>
  
  <pre><code>$teams = Team::all();
  
  return response()-&gt;json($teams);
  </code></pre>
  
  <p>I know how to do this with a normal select, but not sure with vuetify's v-select: </p>
  
  <pre><code>&lt;select id="categories" v-model="selectedValue"&gt;
      &lt;option v-for="item in items" :value="item.id"&gt;{{ item.name }}&lt;/option&gt;
  &lt;/select&gt;
  </code></pre>