rowPerPageOptions в DataTable не отображается - PullRequest
Новая
       9

rowPerPageOptions в DataTable не отображается

2 голосов
/ 23 сентября 2019

Я пытаюсь показать раскрывающийся список строк на страницу в компоненте DataTable из PrimeVUE.

Это код html DataTable I have : 

<DataTable :value="comunicaciones" :paginator="true" :rows="numFilas" :rowsPerPageOptions="comboFilas">

И это data() в my component: 

data() {
    return {
      comunicaciones: null,
      columnas: null,
      numFilas: 10,
      comboFilas: [
        { label: "10", value: 10 },
        { label: "30", value: 30 },
        { label: "50", value: 50 }
      ]
    };
  }

И это генерирует следующий код HTML в page : 

<dropdown value="10" options="[object Object],[object Object],[object Object]" optionlabel="label" optionvalue="value"></dropdown>

Таблица работает нормально, так как все строки загружаются правильно, выпадающий список - единственная проблема, с которой он сталкивается.Может кто-нибудь сказать мне, как я должен передать аргументы, чтобы показать выпадающие строки на странице?Спасибо!

РЕДАКТИРОВАТЬ: Кажется, что установка массива comboFilas, как у меня, или установка его в виде набора целых чисел, являются правильными способами его настройки.Глядя на консоль при загрузке страницы, появляется эта ошибка: 

[Vue warn]: Unknown custom element: <Dropdown> - did you register the component correctly? For recursive components, make sure to provide the "name" option.

found in

---> <RowsPerPageDropdown> at node_modules/primevue/components/paginator/RowsPerPageDropdown.vue
       <DTPaginator> at node_modules/primevue/components/paginator/Paginator.vue
         <DataTable> at node_modules/primevue/components/datatable/DataTable.vue
           <UltimasComunicaciones> at src/components/UltimasComunicaciones.vue
             <App> at src/App.vue
               <Root>

Выглядит так, как будто неправильно загружается выпадающий компонент.Соответствующий код моего компонента выглядит следующим образом: 

<script>
import axios from "axios";
import DataTable from "primevue/datatable";
import Column from "primevue/column";
import Button from "primevue/button";
import Dropdown from "primevue/dropdown";

export default {
  name: "UltimasComunicaciones",
  components: {
    DataTable,
    Column,
    Button,
    Dropdown
  },

Импорт и пути правильные, поэтому, если кто-то сталкивался с этой проблемой, я был бы признателен за помощь!

1 Ответ

1 голос
/ 23 сентября 2019

rowsPerPageOptions требуется массив целочисленных значений для отображения внутри строк на странице dropdown.refer this для получения дополнительной информации.

Я обновил ваш код здесь: 

data() {
    return {
      comunicaciones: null,
      columnas: null,
      numFilas: 10,
      comboFilas: [10,20,30,40,50]
    };
  }
...