Как применить класс к определенной ячейке в таблице Buefy? - PullRequest
Новая
       7

Как применить класс к определенной ячейке в таблице Buefy?

0 голосов
/ 29 октября 2018

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

Шаблон: 

  <b-table :data="status.peerStatus">
    <template slot-scope="props">
      <b-table-column :class="classObject" v-for="(column, index) in columns" :key="index"
        :label="column.label" :visible="column.visible" :width="200">
        {{ props.row[column.field] }}
      </b-table-column>
    </template>
  </b-table>

Сценарий: 

  computed: {
    classObject() {
      return {
        "has-background-info": true
      };
    }

Сейчас вся строка становитсявыделен синим цветом из-за того, что для has-background-info установлено значение true.

Однако я хотел бы нацелиться только на определенную ячейку и условно применить класс, передав значение ячейки, как это сделано.

Сейчас я пытаюсь передать значение ячейки classObject следующим образом

<b-table-column :class="classObject(props.row[column.field])" v-for="(column, index) in columns" :key="index"

И попытаться установить класс соответствующим образом 

 computed: {
    classObject(cellValue) {
      return {
        "has-background-info": cellValue === "YES" ? true : false;
      };
    }

Однако вышеприведенное не работает.Есть ли другой способ сделать это?

1 Ответ

0 голосов
/ 29 октября 2018

Вы должны поставить его в method вместо computed

methods: {
    classObject(cellValue) {
      return {
        "has-background-info": cellValue === "YES" ? true : false;
      };
    }
}
...