Как применить поля b-таблицы thClass или tdClass или class - PullRequest
Новая
       22

Как применить поля b-таблицы thClass или tdClass или class

0 голосов
/ 29 января 2020 
<template>
 <b-table
   striped hover
   :fields="fields"
   :items="list"
   class="table"
 >
</template>
<style lang="scss" scoped>
  .table >>> .bTableThStyle {
    max-width: 12rem;
    text-overflow: ellipsis;
  }
</style>
<script lang="ts">
 import { Component, Vue, Watch } from "nuxt-property-decorator";
 @Component(...)
 export default class className extends Vue {
  fields = [
   {label: 'index', key: 'index', sortable: true, filter: true, editable: true},
   {label: 'title', key: 'title', sortable: true, filter: true, editable: true, tbClass: 'bTableThStyle'},
  ];
 }
</script>

В приведенном выше фрагменте кода я попытался применить CSS только к имени события в полях b-таблицы, используя tbClass. (Ссылочный URL: bootstrap - vue стиль элемента таблицы td )

I't не работает.

Цель состоит в том, чтобы стилизовать только одно поле для поля

1 Ответ

0 голосов
/ 29 января 2020

Для вашего style вы можете попробовать следующий код: 

<style lang="scss" scoped>
  /** or use this class: table thead th.bTableThStyle { ... } */
  .table .bTableThStyle {
    max-width: 12rem !important;
    text-overflow: ellipsis !important;
  }
</style>

Убедитесь, что ваш .bTableThStyle был добавлен к вашему html при проверке вашего элемента.

Надеюсь, это поможет вам.

...