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>
<div>
<q-table
:rows="rows"
:columns="columns"
/>
</div>
</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>
CodePudding user response:
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>[];