在 Vuetify 2.x v-data-table 中使用选项对象

Question

我正在使用v-data-tableVuetify 2.x 中的Vue 组件。<template>    <v-data-table        :hide-default-footer="hideFooter || false"        :ref="modelName + 'Table'"        :id="modelName + 'Table'"        :value="selectedList"        @input="$emit('update:selectedList', $event)"        :headers="dataTable.headers"        :items="collection"        :showSelect="showSelect || false"        item-key="id"        class="elevation-1"        :options.sync="topicsDataTable.options">   </v-data-table></template><script>    export default {        data() {            return {                topicsDataTable: {                    headers: [                        { text: 'Topic', value: 'title', sortable: false },                        { text: 'Current Interval', value: 'current_revision_interval', sortable: false },                        { text: 'Interval Benchmark', value: 'interval_benchmark', sortable: true },                        { text: 'Add Date', value: 'created_at', sortable: true },                    ],                    options: {                        sortBy: 'interval_benchmark'                    }                }            }        }    }</script>根据文档，它指出可以将选项道具传递给组件以控制列排序等。{  page: number  itemsPerPage: number  sortBy: string[]  sortDesc: boolean[]  groupBy: string[]  groupDesc: boolean[]  multiSort: boolean  mustSort: boolean}但是，当我在上面的示例中传递options包含该sortBy属性的对象时，会出现以下错误：this.options.sortBy.findIndex 不是函数这怎么没有被正确传递？

Answer 1

看起来sortBy道具正在等待string[]，而不仅仅是一个string。

尝试这个：

...

data() {

    return {

        topicsDataTable: {

            headers: [

                ...

            ],

            options: {

                sortBy: ['interval_benchmark']

            }

        }

    }

}

...