Как отобразить выделение по условию? (таблица element-ui)

У меня проблема. Я хочу отобразить выбор в соответствии с условием.

Вот пример. Я хочу скрыть выделение для имени "Джефф"

http://jsfiddle.net/8y5cnk1p/2/

Если я попытаюсь использовать "v-if"

<el-table-column type="selection" width="45" v-if="name != 'Jeff'" &nbsp;</el-table-column>

Не работает. Как?

Спасибо!


vue.js element-ui
person kuehne    schedule 08.04.2019    source источник

Ответы (2)


arrow_upward
7
arrow_downward

Вы не можете скрыть флажок, но можете отключить его с помощью атрибута selectable:

<el-table-column type="selection"
                 width="45"
                 :selectable="canSelectRow">
</el-table-column>

methods: {
  canSelectRow(row, index) {
    return row.name !== 'Jeff';
  }
}

Документы: Атрибуты столбца таблицы

person Styx    schedule 08.04.2019
comment
Хороший ответ и скрыть отключенный флажок вы можете, добавив display: none для него style: как этот .el-table-column - selection {.cell {.el-checkbox.is-disabled {display: none; }}} - person a.yushko; 13.01.2020

arrow_upward
0
arrow_downward

Вы можете отобразить столбец флажка.

<el-table-column
  v-if="isShow"
  :key="Math.random()"
  type="selection"
  width="45">
</el-table-column>

Не забудьте ключ !!!

person zaipa    schedule 04.03.2021