Things in q table acting weird. How to fix it?



  • I’m new to programming and this is a translation of a question from my friend who’s bad in English,
    so the question may be funky in some way.

    His problem is that rows in the table wouldn’t show up if its data is named with alphabets unless the whole rows
    is typed into create, and new data he wanted to add like ‘c’: [{1: 102, 2: 202, 3: 302}] would not appear when its added
    with splice in events.

    However, he noticed that when the data is named with numbers like this
    rows = {0: [{1: 100, 2: 200, 3: 300}, 1: [{1: 101, 2: 201, 3: 301}]}
    everything would work just fine.

    This is his q table

    rows = {'a': [{1: 100, 2: 200, 3: 300}, 'b': [{1: 101, 2: 201, 3: 301}]}
          <div v-for="(data, key) in rows" v-bind:key="key" class="col-4 q-mt-md q-mb-xl q-ml-md">
            {{key}}
          <q-table
            :data="data"
            :columns="columns"
            :rows-per-page-options="config.pagination.options"
            :selected-rows-label="sel()"
            :pagination.sync="serverPagination"
            :dense="true"
            :hide-header="false"
            :hide-bottom="true"
            separator="cell"
            row-key="name"
          >
          </q-table>
          </div>
    

    ps. Do I have to put a potato here for the long post?


  • Admin

    rows/data needs to be an array, not an Object.