Vue get/set interface

by Edward Tanguay

HTML

<div id="vue">
  <multilanguageselector v-model="selected"></multilanguageselector>
  {{selected}}
  <hr/>
  <multilanguageselector v-model="selected2"></multilanguageselector>
  {{selected2}}
</div>

JavaScript

new Vue({
	el:'#vue',
  data(){
  	return {
      selected:[],
      selected2:[]
    }
  },
  components:{
    multilanguageselector:{
    	props:['value'],
      template:`
      <select v-model="interface" multiple>
       <option value="en">English</option>
       <option value="de">German</option>
       <option value="fr">French</option>
      </select>`,
      computed:{
      	interface:{
        	get(){
          	return this.value
          },
          set(val){
          	this.$emit('input', val)
          }
        }
      }
    }
  }
})