<script>
var app = new Vue({
el: '#app',
vuetify: new Vuetify(),
components: {},
data() {
return {
searchVacancyName:'',
info: [],
loading: true,
errored: false,
};
},
methods: {
formatter(number) {
const formatter = new Intl.NumberFormat('ru-RU', {
style: 'decimal',
})
return formatter.format(number)
},
},
mounted() {
axios
.get('json')
.then(response => {
this.info = response.data;
})
.catch(error => {
console.log(error);
this.errored = true;
})
.finally(() => (this.loading = false));
},
computed:{
filteredOffer(){
let tempInfo = this.info.fieldTypes
// Process search input
if (this.searchVacancyName != '' && this.searchVacancyName) {
tempInfo = tempInfo.filter((item) => {
return item.vacancyName
.toUpperCase()
.includes(this.searchVacancyName.toUpperCase())
})
}
}
}
});
</script><input class="filter_input" v-model="searchVacancyName" placeholder="Должность">
<code lang="html">
<div class="content__offers" v-for="offers in info.filteredOffer"> ......... </div>
</code>