example.html

<div id="app">
	Click here:
	<ul class="selections">
		<li v-for="option in options" :key="option.value" @click="selectElement(option)">{{ option.name }} (click)</li>
	</ul>
	Selected options:
	<span v-for="option in selectedOptions" :key="option.value">{{ option.name }} <a @click="deselectElement(option)" class="remove">❌</a></span>
	<br />
	<select name="users[]" multiple="multiple" v-model="selected">
		<option v-for="option in options" v-bind:value="option.value">{{ option.name }}</option>
	</select>
</div>
<script src="https://cdn.jsdelivr.net/npm/vue@3.4.15"></script>
<script type="text/javascript">
var app = {
	data() {
		return {
			options: [
				{name: 'First', value: '1'},
				{name: 'Second', value: '2'},
			],
			selected: [],
		}
	},
	methods: {
		selectElement(element) {
			this.selected.push(element.value);
		},
		deselectElement(element) {
			this.selected.splice(this.selected.indexOf(element.value), 1);
		},
	},
	computed: {
		selectedOptions() {
			return this.options.filter(element => this.selected.indexOf(element.value) > -1);
		},
	},
};
var test = Vue.createApp(app).mount('#app');
</script>