Collectives™ on Stack Overflow

Find centralized, trusted content and collaborate around the technologies you use most.

Teams

Q&A for work

Connect and share knowledge within a single location that is structured and easy to search.

I'm using vue 3 with quasar and I would to make a wrapper for q-table but how can I define rows without using any[].

It works like this but then whenever I use this component I'll have to convert my object to unknown. Is there any better way? Or I should just turn off "no-explicit-any" and use any[]?

<template>
    <q-table
      :rows="rows"
      :columns="columns"
</template>
<script lang="ts" setup>
import { computed } from 'vue';
import { QTableProps } from 'node_modules/quasar/dist/types/index';
interface Props {
  columns?: QTableProps['columns'];
  rows?: unknown[];
const props = withDefaults(defineProps<Props>(), {
  rows: undefined
const rows = computed(() => props.rows)
const columns = computed(() => props.columns)
</script>
                If you don't care about the type of rows just use any[]. It's fine. If you want the IDE checks the type of rows then define an explicit type for it
– Duannx
                Apr 28, 2022 at 2:09
QTable.rows expects an array of objects, containing string keys and string/number values.
So rows should be typed as:
interface Props {
  columns?: QTableProps['columns'];
  rows?: Record<string, string | number>[]; 👈
Side notes:
Specifying undefined as a default value is effectively the same as not specifying a default at all. You can remove the withDefaults() in your example.
The computed props that just return the original props have no useful effect. You could remove these computed props, and just use props.rows and props.columns directly.
        
Thanks for contributing an answer to Stack Overflow!
Please be sure to answer the question. Provide details and share your research!
But avoid …
Asking for help, clarification, or responding to other answers.
Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.