title: How to get index data from object used in v-for in select
body: <p>I have a component involving a select element. Below, opts is an array of objects.</p>
  
  <pre><code>Vue.component('atcf-select', {
      props: [
          'opts',
      ],
      data() {
          return {
              element_index: '',
          };
      },
      template: `
          &lt;div&gt;
              &lt;select @change="onChange(opt,index)"&gt;
                  &lt;option v-for="(opt,index) in opts"&gt;
                      {{ opt.text }} {{opt.index}}
                  &lt;/option&gt;
              &lt;/select&gt;
          &lt;/div&gt;
      `,
      methods: {
          onChange(opt,index) {
              //Do something with opt and index...
          }
      }
  };
  </code></pre>
  
  <p>The problem is obviously I cannot get the selected opt object and its index, and use it as a parameter for onChange method. What is the correct way to get the selected option's index and object?</p>