[Vuejs]-Proper way to display and filter an object in VueJS

by

1👍

✅

you can use vue filters

https://v2.vuejs.org/v2/guide/filters.html

// create global filter
const mySpecialFormat = Intl.NumberFormat("en-US");
Vue.filter('numberFormatEn', function (value) {
  if (!value) return ''
  return mySpecialFormat.format(value.toString())
})

// then use it somewhere
{{ DataCounts._ids | numberFormatEn }}

or something along those lines

EDIT: Or did you mean how to simplify Object(k,v) -> html(ul)

in that case something like

https://v2.vuejs.org/v2/guide/list.html

<ul v-for="(value,key) in DataCounts" :key="some-key">
  <v-icon v-if="...">{{ mdiArch }}</v-icon>
  {{ value | numberFormatEn }}
  Location Records
</ul>

Leave a comment