Topic: Typescript definition for Table Editor plugin is focused on example data
Expected behavior v-model:dataset should accept user-specified data, instead... Actual behavior ... it results in this typescript error: Type UnwrapRef is not assignable to type {columns: {label: string, field: string, width?: number, sort?: unknown, defaultValue?: unknown, options?: unknown, inputType?: unknown, left?: number}[], rows: {office?: string, company?: string, employees?: number, international?: boolean}[]} Resources (screenshots, code snippets etc.)
Bartosz Cylwik staff answered 10 months ago
Hi! Can you provide some example? I've tried this dataset and it doesn't throw typescript issues for me. Does this dataset show errors for you?
const inputsData = ref({
columns: [
{
width: 250,
label: "Company",
field: "company",
},
{
width: 100,
defaultValue: false,
inputType: "checkbox",
label: "International",
field: "international",
},
{
width: 250,
inputType: "number",
defaultValue: 1,
label: "SomeNumber",
field: "someNumber",
},
],
rows: [
{
company: "Smith & Johnson",
international: true,
someNumber: 1,
},
{
company: "P.J. Company",
international: false,
someNumber: 1,
},
],
});
bernspe pro premium priority answered 10 months ago
Yours is ok, but mine doesnt work: const inputsData = ref({ columns: [{'label': 'Datum', 'field': 'date', 'editable': false}], rows: dataset9.value.rows })
const dataset9 = ref({ columns: [{'label': 'Datum', 'field': 'date', fixed: true}, {'label': 'Wochentag', 'field': 'weekday'}], rows: [{'date': 'Zahl der Dienste'}] });
interface Dataset9 { columns: { [props: string]: any }[], rows: { [props: string]: string }[], }
Any suggestions?
Bartosz Cylwik staff commented 10 months ago
I see, there is a typescript issue with the rows
property. I've added this to our to-fix list.
We can still make it work though. We can assing a type to the rows
property so that the typescript wont throw any issues. You can either use types from the Dataset9
interface or create a new interface - for example DatasetRows
and apply it to the rows
. Like this:
interface Dataset9 {
columns: { [props: string]: any }[];
rows: { [props: string]: string }[];
}
interface DatasetRows {
[props: string]: string;
}
const inputsData = ref({
columns: [{ width: 100, label: "Datum", field: "date", editable: false }],
rows: dataset9.value.rows as DatasetRows[],
// rows: dataset9.value.rows as Dataset9["rows"],
});
bernspe pro premium priority commented 10 months ago
Well, that doesn't help. The issue is, that inputsData expects row-types from the example (e.g company, office, etc.) Maybe you just have to clean that?
Bartosz Cylwik staff commented 10 months ago
Yes, we are going to fix that for the next release.
Does setting the type as DatasetRows[]
or Dataset9["rows"]
not work for you? It doesn't throw typescript errors for me. Did you try changing the type to any
?
rows: dataset9.value.rows as any,
FREE CONSULTATION
Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.
Answered
- User: Pro
- Premium support: Yes
- Technology: MDB Vue
- MDB Version: MDB5 4.1.1
- Device: Desktop
- Browser: Chrome
- OS: MacOSX
- Provided sample code: No
- Provided link: No