Arhn - архитектура программирования

Как обрабатывать элементы, добавленные или удаленные из DOM с помощью шаблона веб-интерфейса Dart

Каков наилучший способ обработки элемента в (последнем) веб-интерфейсе Dart, когда он добавляется или удаляется из DOM с помощью шаблона? В идеале я хотел бы зарегистрировать обратный вызов прямо в шаблоне, но это не обязательно.

Предыстория: мне нужно зарегистрировать/отменить регистрацию определенных элементов DOM из двух библиотек JS (одна из которых является плагином JQuery). Поскольку в моем шаблоне используются циклы и условные операторы (и привязка данных), элементы могут появляться и исчезать в любое время, и я не могу просто зарегистрировать их после первоначального рендеринга.

dart dart-webui
01.06.2013

  • Питер, получилось ли у вас работать с методами жизненного цикла веб-интерфейса? 10.08.2013
  • Извините, я приостановил проект и поэтому не добился прогресса. Тем не менее, ваш ответ был ценным, и после дополнительных исследований я считаю, что это правильный способ решить эту проблему (хотя мне это все еще кажется странным). Поэтому я с радостью приму ваш ответ. 16.08.2013

Ответы:


1

В класс вашего компонента можно добавить обратные вызовы, которые срабатывают при его создании, вставке в DOM или удалении из DOM.

Спецификация веб-интерфейса: методы жизненного цикла

class MyComponent extends WebComponent {

  inserted() {
    // Do stuff when inserted into DOM.
  }

  removed() {
    // Do stuff when removed from DOM.
  }
}
02.06.2013
  • Плагины JS требуют использования определенного типа элемента (например, div или ul). Означает ли это, что мне нужно расширить что-то вроде DivComponent? Будет ли это по-прежнему распознаваться JS/CSS как div? Пользовательский веб-компонент кажется не совсем подходящим для этого (предположительно распространенного) требования, но если он работает, это определенно лучше, чем ничего. 02.06.2013
  • Пользовательский компонент должен быть объявлен как тип div, абзаца или другого элемента HTML, а затем использовать класс, который вы определяете, как его конструктор, так что я думаю, у вас все будет хорошо. Посмотрите, как объявить пользовательский компонент... dartlang.org/ article/web-ui/#component-declaration, в примере используется ‹element name=x-click-counter конструктор=CounterComponent extends=div›. Это самый чистый способ, который я могу придумать для отслеживания вставки и удаления, но если ваши элементы нелегко разделить на компоненты, надеюсь, есть другое решение. 03.06.2013
    • Новые материалы
    Коллекции публикаций по глубокому обучению
    Последние пару месяцев я создавал коллекции последних академических публикаций по различным подполям глубокого обучения в моем блоге https://amundtveit.com - эта публикация дает обзор 25..
    Представляем: Pepita
    Фреймворк JavaScript с открытым исходным кодом Я знаю, что недостатка в фреймворках JavaScript нет. Но я просто не мог остановиться. Я хотел написать что-то сам, со своими собственными..
    Советы по коду Laravel #2
    1-) Найти // You can specify the columns you need // in when you use the find method on a model User::find(‘id’, [‘email’,’name’]); // You can increment or decrement // a field in..
    Работа с временными рядами спутниковых изображений, часть 3 (аналитика данных)
    Анализ временных рядов спутниковых изображений для данных наблюдений за большой Землей (arXiv) Автор: Рольф Симоэс , Жильберто Камара , Жильберто Кейрос , Фелипе Соуза , Педро Р. Андраде ,..
    3 способа решить квадратное уравнение (3-й мой любимый) -
    1. Методом факторизации — 2. Используя квадратичную формулу — 3. Заполнив квадрат — Давайте поймем это, решив это простое уравнение: Мы пытаемся сделать LHS,..
    Создание VR-миров с A-Frame
    Виртуальная реальность (и дополненная реальность) стали главными модными терминами в образовательных технологиях. С недорогими VR-гарнитурами, такими как Google Cardboard , и использованием..
    Демистификация рекурсии
    КОДЕКС Демистификация рекурсии Упрощенная концепция ошеломляющей О чем весь этот шум? Рекурсия, кажется, единственная тема, от которой у каждого начинающего студента-информатика..