#vue.js #bootstrap-vue #scoped
#vue.js #bootstrap-vue #область действия
Вопрос:
В App.vue есть дочерний компонент, т.е. getQuote.vue, который включает в себя некоторые стили для компонента bootstrap-vue, как показано ниже:
<template>
<b-container class="bv-example-row" ref="quoteContainer">
<b-form>
<b-form-row>
<b-col>
<b-form-group label="Tobacco" v-slot="{ ariaDescribedby }">
<b-form-radio-group
class='pt-3'
id="btn-radios-1"
v-model="tobacco"
:options="tobacco_options"
:aria-describedby="ariaDescribedby"
button-variant="outline-primary"
size="lg"
name="radio-btn-outline-tobacco"
buttons
></b-form-radio-group>
</b-form-group>
</b-col>
</b-form-row>
</b-form>
...
…
здесь в компонент bootstrap-vue добавлен атрибут области видимости.
но он отображает переключатели как:
Комментарии:
1. Удалите
scoped
модификатор и повторите попытку.2. да, это работает после удаления
scoped
, но я хочу, чтобы эти стили были видны из сгенерированной сборки3.
scoped
стили плохо работают с глубокими селекторами CSS. Вы должны попробовать>>>
, помогает ли использование.