0

Please help. I have been using Vue Tables 2 for > 2 years now, and I have never had this problem. My table shows up perfectly as usual, but now whenever I click on a cell, it is surrounded by a blue outline on chrome and a dotted outline on firefox. It is exhibiting the same behavior as if I had clicked on an input. I went through my Vue Tables 2 options one by one, disabling each in turn and it did not change the behavior. I looked through bootstrap 4 tables documentation, and could not find the same behavior as a option, so i believe it is vue tables that is doing it. The demo fiddle on the Vue Tables 2 page also has this behavior. It is very distracting and I am trying to get it to stop.

My goal is to have the table show the behavior it has before, which is to do nothing when you click on a cell.

I am using Bootstrap 4.4, and Vue-Tables-2 version 1.6.25

My options array looks like so

tableOptions: {
            skin: 'table table-sm table-hover border-0',
            filterable: true,
            pagination: { chunk:4 },
            perPageValues: [],
            perPage: 18,
        dateColumns: ['created_at'],
        dateFormat: 'MM-DD-YYYY',
        toMomentFormat:  'YYYY-MM-DD H:mm:ss',
            texts:{
                filter:"",
                count:"",
                filterPlaceholder:"Search",
                page:"Page:",
                noResults:"No matching records",
                loading:'Loading...',
            },
            columnsClasses: {
                cntCnt: 'text-center noOutline',
                qtCnt: 'text-center noOutline', 
                statusName: 'text-center noOutline',
                created_at: 'text-center ',
            }, 
            headings: { 
                id: 'Ref',
                name: 'Name',
                cntCnt: 'Contacts',
                qtCnt: 'Quotes', 
                statusName: 'Status',
                created_at: 'Created',
                orgSelect: '',
            },
        }

I have added a picture that shows whats going on.The outline is arouns any and every cell I click, including the column headers.

outline around table cell

4

1 回答 1

2

那是正在应用样式的 CSS 的焦点选择器。见这里:https ://developer.mozilla.org/en-US/docs/Web/CSS/:focus

您需要覆盖此 CSS 并将边框设置为无。

你也可以这样做:

:focus { outline: none; }
于 2020-02-17T04:12:58.813 回答