Vue - Two way binding for select element using v-bind and props

I have a child component:

select(v-model="selectedItem", @change="emitChange")
  option(:value="{id: '123', value: 'foo'}") 123
  option(:value="{id: '456', value: 'bar'}") 456

data: {
  selectedItem: '',
},
methods: {
  emitChange() {
    this.$emit('change', this.selectedItem);
  },
}

The above one works fine.

But I want to make the value of <select> depends on the parent.

So I do the following:

select(:value="selectedItem", @change="emitChange")
  option(:value="{id: '123', value: 'foo'}") 123
  option(:value="{id: '456', value: 'bar'}") 456

props: ['selectedItem'],
methods: {
  emitChange(e) {
    this.$emit('change', e.target.value);
  },
}

Where parent will catch the event and change selectedItem.

But this doesn't work. e.target.value will be something like [object Object].

What am i missing here?