Vue.js Load select box with REST API Data
Last Updated: March 10, 2020
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); });