Инструкция <b:isolate/> указывает, что разметка шаблона и его стили должны быть изолированы. Это означает, что для каждого шаблона генерируется свой уникальный префикс и добавляется ко всем именам классов. Такой подход позволяет избежать конфликта имен и смешивания стилей разных компонент.
Пример шаблона:
<b:isolate/>
<b:style>
.some-class {
color: red;
}
</b:style>
<div class="some-class">Компонент</div>Результат:
.i1__some-class {
color: red;
}<div class="i1__some-class">Компонент</div>По умолчанию префикс генерируется случайным образом. Указав атрибут prefix, можно задать собственный префикс для изоляции:
<b:isolate prefix="my-prefix_"/>
<b:style>
.some-class {
color: red;
}
</b:style>
<div class="some-class">Компонент</div>Результат:
.my-prefix_some-class {
color: red;
}<div class="my-prefix_some-class">Компонент</div>Инструкция действует только для корневого шаблона (тот, что используется) и не наследуется от включаемых шаблонов (фрагментов). Если шаблон в своем описании имеет инструкцию <b:isolate> и при этом включается в другой шаблон через <b:include>, то инструкция игнорируется. Если требуется изолировать только включаемый фрагмент, то нужно использовать атрибут <b:include isolate/>. Так шаблон, включающий другие шаблоны, определяет, что и как нужно изолировать.