Добавить атрибут к дочернему элементу в Grape Js?

Question

Я работаю в JES в течение длительного времени.

Теперь я сталкиваюсь с проблемой init.

Выпуск:

Это компонент, который я пытаюсь добавить в редакторе.

<div class="page">
      <div class="col1"></div>
      <div class="col2"></div>
 </div> 

После добавления этих компонентов я пытаюсь добавить некоторые вычисленные значения к таким элементам, как это,

element.on('component:add',function(ele){
   ele.addAttributes({
     'data-top' : topOffset,
     'data-left' : leftOffset,
   });

   editor.render();// For render Updated html
});

Но этот код только обновляет .page только компонент.

Как я могу добавить эти атрибуты в .col1,.col2 элементы внутри .page составная часть?

Answer 1

Я читаю документацию и, похоже, нет простого способа получить то, что вы хотите. Однако вы можете сделать что-то вроде ниже фрагмента. Он перебирает все дочерние элементы и добавляет к ним атрибуты.

editor.on('component:add', function (ele, argument) {
   ele.setAttributes({
     'data-top' : 10,
     'data-left' : 20,
   });

   ele.attributes.components.models.forEach(function(item){
      if(item.attributes.tagName == 'div') {
         item.setAttributes({
           'data-top' : 10,
           'data-left' : 20,
         })
      }
   })

   editor.render();// For render Updated html
})