Emit event on selector option click

Form.vue

<!-- parent form component -->

<template>
  <form>
    <FormSelector
       :options="users"
       :selected="currentUser"
       @change="onUserChange($event)"
    />
  </form>
</template>

<script>
export default {
    name: 'Form',
    data () {
      return {
        users: [.......],
        currentUser: 'John'
      }
    },
    methods: {
        onUserChange (e) {
            /* do something */
        }
    }
}
</script>

FormSelector.vue

<template>
    <select
        :value="selectedOption"
        @change="$emit('change', $event)"
    >
        <option
            v-for="(option, index) in options"
            :key="index"
            :value="option.value"
        >{{ option.text }}</option>
    </select>
</template>

<script>
export default {
    name: 'FormSelector',
    props: {
        selected: {type: Number | String},
        options: {type: Array},
    },
    computed: {
        selectedOption () {
            return this.selected
        }
    }
}
</script>