Всем привет, только вникаю в TypeScript
вот код
<template>
<div class="content-table">
<div class="content-table__row" v-for="(tr, index) in tables" :key="index">
<input
v-for="(td, tdIndex) in tr.values"
:key="tdIndex"
v-model="td.value"
type="text"
class="form-control"
autocomplete="off"
@keyup="returnTable"
/>
<template v-if="index == 0">
<button @click.prevent="addColumn()" class="btn btn-info">
<IconRight />
</button>
<button @click.prevent="removeColumn()" class="btn btn-default">
<IconDelete />
</button>
</template>
<template v-else>
<button @click.prevent="addRow()" class="btn btn-info">
<IconDown />
</button>
<button
@click.prevent="removeRow(index)"
class="btn btn-default"
v-if="index > 1"
>
<IconDelete />
</button>
</template>
</div>
</div>
</template>
<script lang="ts">
import IconDown from '@/static/icons/arrow-down.svg?inline'
import IconRight from '@/static/icons/arrow-right.svg?inline'
import IconDelete from '@/static/icons/delete.svg?inline'
import Vue from 'vue'
export default Vue.extend({
components: {
IconDelete,
IconDown,
IconRight,
},
props: {
input: {
type: Array,
default: () => [
{
values: [
{
value: '',
},
{
value: '',
},
],
},
{
values: [
{
value: '',
},
{
value: '',
},
],
},
],
},
},
data() {
return {
tables: this.input,
}
},
methods: {
addColumn() {
this.tables.forEach((item: any) => {
item.values.push({
value: '',
})
})
},
removeColumn() {
this.tables.forEach((item: any) => {
if (item.values.length > 2) item.values.pop()
})
this.returnTable()
},
addRow() {
const data: any = this.tables[0].values.slice()
const input: any[] = []
for (let i = 0; i < data.length; i++) {
input.push({
value: '',
})
}
this.tables.push({
values: input,
})
const lastIndex: number = this.tables.length - 1
this.tables[lastIndex].values.forEach((item: any) => {
item.value = ''
})
this.returnTable()
},
removeRow(index: number) {
this.tables.splice(index, 1)
this.returnTable()
},
returnTable() {
this.$emit('input', this.tables)
},
},
})
</script>
и вот на что ругается
ERROR ERROR in components/modules/tables/TableDynamic.vue:96:25 13:28:43
TS2571: Object is of type 'unknown'.
94 | },
95 | addRow() {
> 96 | const data: any = this.tables[0].values.slice()
| ^^^^^^^^^^^^^^
97 | const input: any[] = []
98 | for (let i = 0; i < data.length; i++) {
99 | input.push({
ERROR in components/modules/tables/TableDynamic.vue:109:7
TS2571: Object is of type 'unknown'.
107 |
108 | const lastIndex: number = this.tables.length - 1
> 109 | this.tables[lastIndex].values.forEach((item: any) => {
| ^^^^^^^^^^^^^^^^^^^^^^
110 | item.value = ''
111 | })
112 | this.returnTable()