pedi2/resources/js/components/RegionSelect.vue

<template>
	<div class="block">
		<div class="field">
		    <label class="label" :class="whiteText ? 'has-text-white' : ''">Seleccioná tu región</label>
	        <div class="control">
	        	<div class="select">
	        		<select @change="onRegionSelected" v-model="region">
			    		<option :disabled="isDefaultDisabled===1" value=null>Seleccionar</option>
						<option v-for="region in regiones" v-text="region" :name="region"></option>
					</select>
				</div>
			</div>
		</div>
	</div>
</template>

<script>
	export default {
		data() {
			return {
				regiones: [],
				isDefaultDisabled: 0,
				region: null,
                whiteText: this.admin == null ? false : this.admin
			}
		},
		mounted() {
		    axios.get("/api/regiones").then(response => this.regiones = response.data);
	  	},
	  	methods: {
	  		onRegionSelected() {
	  			this.isDefaultDisabled = 1;
	  			Event.$emit("region-seleccionada",this.region);
	  		}
	  	},
        props: {'admin': Boolean}
	}
</script>