Business
Jobs
  • About Us
  • Solutions
    • Job Postings
      Post your job and receive qualified candidates in 48h.
    • Candidate Assessments
      500+ technical and psychological tests, plus anti-fraud.
    • Headhunting
      Tailor-made executive search from start to finish.
    • Payroll + EOR
      Payroll dispersal and EOR across 15+ LATAM countries.
  • Pricing
  • Jobs

0

376
Views
Using global filters in Quasar/Vue with q-table

I try to use a filter I created as a Quasar boot-file,

export default ({ app }) => {
  app.config.globalProperties.$filters = {
    in_k: function (value, avoidSign, decimals=1) {
      value = Math.round(value / 1000 * Math.pow(10, decimals)) / Math.pow(10, decimals);
      return new Intl.NumberFormat("sv-SE", {
          style: "decimal",
          useGrouping: false,
          minimumFractionDigits: decimals,
          maximumFractionDigits: decimals,
          signDisplay: value !== 0 && !avoidSign ? "always" : "never",
        }).format(value) + "K";
    },
    }
}

which works well in my page template

{{ $filters.in_k(123456, true) }} // 123.5K

but using it within the page's script does not work:

<q-table
      title="Treats"
      :rows="rows"
      :columns="columns"
      row-key="title"
    />
export default ({
  name: 'PageIndex',
  setup() {
    const $store = useStore();

    let columns = [
      {
        name: 'name',
        required: true,
        label: 'Title',
        align: 'left',
        field: row => row.title,
        format: val => `${val}`,
        sortable: true
      },
      
      {
        name: 'invested', align: 'right',
        label: 'Invested',
        field: row => (row.invested),
        format: val => `${$filters.in_k(val, true)}`,
        sortable: true
      },

    ];

    return {
      columns,
      rows: $store.state.generic_store.data
    }
  }
})

The error I get in the console is this:

ReferenceError: $filters is not defined
    at Object.format (Index.vue?8b24:53)

Does anyone have an idea on how to access the filter in every template, preferably even the {{ 123456 | in_k(true) }} notation?

about 4 years ago · Juan Pablo Isaza
1 answers
Answer question

0

I think you need to access it like this this.$filters

about 4 years ago · Juan Pablo Isaza Report
Answer question
Find remote jobs

Discover the new way to find a job!

Top jobs
Top job categories
Business
Post vacancy Pricing Sales
Legal
Terms and conditions Privacy policy
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Show me some job opportunities
There's an error!