Vue.js Load select box with REST API Data

In this example, you can see how to load the data to select box using Rest Api.

In template section, you need to have the following code

<select v-model="customer.company.id" >
  <option v-for="(com, index) in companies" :value="com.id">{{com.name}}</option>
</select>

Next you can add the data variables

    data() {
        return {
            rows:'',
            customer:{
               company:{
                   id:''
               }
            },
         
        }
    }

Then add the computed values

computed: {
       
        companies(){
            return this.rows 
        }
    },

Finally load the data from the Rest Api

this.$store.dispatch('getObject', {
                'url': Properties.API_URL+ Properties.GET_CONTACTS+"/" + this.$route.params.id
            })
            .then(response => {
                this.customer = response.data.data
                this.isLoading = false

            })
            .catch(error => {
                console.log(error);

            });