<div v-if="!isLocalstorageEmpty">Loading your data...</div>
<div v-else>
<GreyBrands/>
</div>
this.isDataReady =
true
и отображаете компоненты уже с данными. // store
fetchData({ commit }) {
return fetch('/api/data/')
.then(response => response.json())
.then((response) => {
commit('SET_DATA', response.data);
});
}
this.$store.dispatch('fetchData')
this.$emit('input', defaultButton.value); // value из найденого объекта
throw new Error('You should provide at least one default button.')
<script>
computed: {
activeButton() { return this.buttons.find(btn => btn.default); }
}
</script>
<template>
<div class="btn-group" style="display: block; margin-bottom: 10px; overflow: hidden;">
<button v-for="(button, index) in buttons" :key="index" @click="select($event, button.value)" class="btn btn-default" :class="[this.activeButton.value === button.value? 'btn-active': '']" type="button">{{ button.label }}</button>
</div>
</template>