bemto icon indicating copy to clipboard operation
bemto copied to clipboard

Scope of elements for block

Open mikhin opened this issue 6 years ago • 2 comments

Hello, is there any way to control the scope of elements?

For example:

mixin block1()
  +b.block1&attributes(attributes)
    +block2
      +e.block1element1
      +e.block1element2

render as

.block1
  .block2
    .block2__block1element1
    .block2__block1element2

but I need to get this

.block1
  .block2
    .block1__block1element1
    .block1__block1element2

i.e. skip the scope of mixin block2.

mikhin avatar Oct 10 '19 15:10 mikhin

@kizu , hi! Could you help with this, please?

mikhin avatar Nov 28 '19 21:11 mikhin

@mikhin как я понял такой возможности нет, так как блоки берутся bemto_objects[bemto_objects.length - 1], для себя нашел подобный выход:

в bemto.pug

//- Block
mixin b(options)
  - var settings = get_bemto_settings()
  //- TODO: should we make it generic way for other settings too?
  if options && options.prefix !== undefined
    - settings.prefix = options.prefix

  //- Rewriting the class for elements and modifiers
  - var tag = options && options.tag || ( typeof options == 'string' ? options : '')
  - var isElement = options && options.isElement
  - var tagMetadata = options && options.metadata
20: >>>> - var ref = options && options.b <<<<
  - var block_sets_context = false
  if attributes.class
    //- Creating and normalizing bemto classes
    - var bemto_classes = attributes.class
    if bemto_classes instanceof Array
      - bemto_classes = bemto_classes.join(' ')
    - bemto_classes = bemto_classes.split(' ')


    - var bemto_objects = []
    - var is_first_object = true
    - var new_context = []

    each klass, i in bemto_classes
      - var bemto_object = {}
      - var prev_object = bemto_objects[bemto_objects.length - 1]
      - var sets_context = false

      //- Catching the optional tag class
      if klass.match(/^[A-Z-]+[A-Z0-9-]?$/)
        - tag = klass.toLowerCase()
        - continue


      //- Use block as a context for the first class if we're at element
      if is_first_object && isElement
  47:        >>>> if ref <<<<
  48:        >>>> - bemto_object['context'] = [ref] <<<<
        else
          - bemto_object['context'] = bemto_chain[bemto_chain.length - 1]

при создании элемента указываем ему к какому блоку он относится:

+b.footer
  +b.container
    +e({b:'footer'}).item

получаем результат

<div class="footer">
   <div class="container">
       <div class="footer__item"></div>
   </div>
</div>

rostixman avatar Dec 09 '19 10:12 rostixman