Vue.jsによるformのselectによるリンクメニューの実装

HTML

<div id="target">
  <select v-model="selected" v-on:change="jump">
    <option v-for="option in options" v-bind:value="option.value">
      {{ option.text }}
    </option>
  </select>
</div>

Vue.js

  new Vue({
    el: '#target',
    data: {
      selected: '',
      options: [
        { text: '選択してください', value: '' },
        { text: 'Yahoo', value: 'https://www.yahoo.co.jp/' },
        { text: 'Google', value: 'https://www.google.co.jp/' }
      ]
    },
    methods: {
        jump: function(e){
          location.href = e.target.value;
        }
    }
  })