Vue-loader глубокий селектор с прямым ребенком - PullRequest
Новая
       18

Vue-loader глубокий селектор с прямым ребенком

0 голосов
/ 17 мая 2019

У меня есть компонент вкладки, внутри которого есть другие вкладки, такие как 

<tabs :class="{ 'my-class': ifTrue }">
    <tab v-for="tab in tabs">
        ...
    </tab>
    <tab-item v-for="tab in tabs">
        <tabs :class="{ 'my-class': ifTrue }">
            <tab v-for="tab in tabs">
                ...
            </tab>
            <tab-item v-for="tab in tabs">
                ...
            </tab-item>
        </tab>
    </tab-item>
</tab>

<style scoped>
    .no-tabs >>> .tab {
        display: none
    }
</style>

От компонента, в котором я использую tabs, я хочу скрыть прямого потомка tab, если у него есть класс, проблема в том, что когда я применяю класс, как указано выше, он будет скрывать tab в tab-item также я хочу просто скрыть дочернюю вкладку прямого доступа. Что-то вроде 

In css would be 
.no-tabs > .tab

But in vue i try this but wont work.

.no-tabs >>> > .tab
or
.no-tabs > >>> .tab

но ни один из них не работал. Как я могу получить доступ только к первой вкладке direct child .tab?

Я не могу редактировать tabs компонент, поэтому я не делаю это прямо там.

1 Ответ

1 голос
/ 17 мая 2019

По какой-то причине vue-loader не понимает эту форму

.no-tabs >>> > .tab

Использование этого сработало для меня

.no-tabs /deep/ > .tab

...