title: How do I use v-model on none form-related elements?
body: <p>Before anything else, I'm using Vuetify's <code>VSwitch</code> component inside <code>my-component</code>. I want to return the value of <code>my-component</code> to the parent.</p>
  
  <p>something like <code>&lt;my-component v-model="returnedData"&gt;&lt;/my-component&gt;</code></p>
  
  <p>Then the inside <code>&lt;my-component&gt;&lt;/my-component&gt;</code></p>
  
  <pre class="lang-html prettyprint-override"><code>&lt;template&gt;
    &lt;div&gt;
      &lt;v-switch v-model="toggledData" value="John"&gt;&lt;/v-switch&gt;
      &lt;v-switch v-model="toggledData" value="Andrew"&gt;&lt;/v-switch&gt;
      &lt;v-switch v-model="toggledData" value="Melissa"&gt;&lt;/v-switch&gt;
      &lt;v-switch v-model="toggledData" value="Elizabeth"&gt;&lt;/v-switch&gt;
    &lt;/div&gt;
  &lt;/template&gt;
  
  &lt;script&gt;
  export default {
    props: ['value'],
    data () {
      return {
        toggledData: []
      }
    }
  }
  &lt;/script&gt;
  </code></pre>
  
  <p>I want to return the value of <code>toggledData</code> to the parent that's using it if possible. I've been browsing the net for a while and I've been seeing only with inputs. But it was possible to some of Vuetify's components like the <code>VTreeview</code>so I was thinking maybe it's possible.</p>