Сделайте rowspan равным 2, если индекс v-for отличается от 2 значений

#javascript #vue.js

#javascript #vue.js

Вопрос:

У меня есть следующая таблица:

 <table class="table table-condensed table-sm table-striped table-bordered" id="list">
    <thead>
        <tr>
            <th v-for="(column, index) in columns" :key="index" :rowspan="{ '2': index != 'new_value' || 'old_value' }">
                {{ column }}
            </th>
        </tr>
    </thead>
    <tbody>
        <tr v-for="(entry, index) in results" :key="index">
            <td v-for="(key, index) in columns" :key="index">
                {{ entry._source[index] }}
            </td>
        </tr>
    </tbody>
</table>
 

В котором я хочу, чтобы диапазон строк для заголовка таблицы, который не равен new_value или old_value равен 2, однако в текущем коде заголовок таблицы имеет a [object Object] вместо числа:

 <th rowspan="[object Object]">User</th>
 

Что мне делать?

Комментарии:

1. Что такое "new_value" || "old_value" ?

2. @Psidom — это два индекса внутри columns массива, который запускается v-for, будь то «id», «user», «type», «old_value», «new_value»

Ответ №1:

rowspan атрибут ожидает число, а не объект. Попробуйте:

 :rowspan="index !== 'new_value' amp;amp; index !== 'old_value' ? 2 : 1"
 

Комментарии:

1. Это применяло 2 ко всем THS.

2. Извините, так и должно быть amp;amp; . Смущает ваш исходный синтаксис.