Отказ от ответственности: я очень доволен направлением, и спасибо за всю проделанную работу до сих пор, поскольку в новой системе есть огромный потенциал. Нужно лишь убедиться, что мы сохраним аналогичные возможности? …
В моём компоненте TLP я в настоящее время динамически устанавливаю атрибут style для внешнего тега элемента списка тем:
устанавливаю цвет background: в уникальное значение RGB, чтобы он соответствовал доминирующему цвету изображения. В идеале это должно выполняться в цикле Ember.
Также я устанавливаю grid-row-end, чтобы очень быстро определить размер элемента типа masonry. Это очень быстро и эффективно и позволяет избежать большого количества JavaScript. Однако для этого я использую JavaScript, так как это зависит от окончательных размеров в DOM.
В настоящее время эти две функции сосуществуют без проблем.
Обе эти настройки критически важны для компонента темы, и без них его поддержка была бы невозможна.
Первое изменение стиля в настоящее время достигается путём прямой привязки атрибута style с использованием modifyClass, что, как я понимаю, является устаревшим методом.
Возможно ли предоставить API для этого в новой системе?
Или, возможно, я упустил существующий способ решения этой задачи?
Однако я не считаю, что это можно реализовать с помощью классов.
Всё ещё актуален ли modifyClass? (Возможно, просто обновлён синтаксис — если это так, было бы полезно сослаться на ту инструкцию)
Могу ли я по-прежнему использовать его для доступа к атрибуту style у enclosing тега?
Классические компоненты отличаются тем, что исторически они предоставляли доступ к атрибутам уровня enclosing тега вне шаблона, поэтому их было straightforward модифицировать динамически в коде.
Ах, вы правы. В консоли есть уведомление об устаревании.
Уведомление об устаревании: Изменение ‘component:topic-list-item’ с помощью ‘modifyClass’ устарело. Вместо этого используйте преобразователь значений ‘topic-list-columns’ и другие новые API плагинов для списка тем.
Сама функция modifyClass не устарела. Это рискованный метод кастомизации, и при его использовании следует соблюдать меры предосторожности (как описано в документации, на которую ссылается @don), но у нас нет планов по её удалению в ближайшее время.
Мы выводим сообщение об устаревании для component:topic-list и component:topic-list-items, потому что эти компоненты являются устаревшей реализацией списка тем и не используются, когда включён список тем на Glimmer. Сейчас у нас есть набор компонентов Glimmer, таких как components/topic-list/item.
Технически вы можете использовать modifyClass для этих новых компонентов. Однако, поскольку это компоненты Glimmer, вы не сможете изменить тег style через JS-класс, поэтому это не поможет решить проблему, описанную в исходном посте.
В официальном компоненте темы d-topic-thumbnails есть аналогичный режим «мазонки», поэтому стоит посмотреть, как он реализован. Мы добавляем уникальный класс к каждой «строке» списка тем:
Затем мы рендерим динамический тег <style> в отдельном плагин-оутлете, который нацелен на эти имена классов:
Тем не менее… это немного запутанно, поэтому, возможно, стоит рассмотреть возможность добавления конкретного valueTransformer для изменения атрибута style=. Это немного сложно из-за защиты Ember от XSS/htmlSafe для этого атрибута… но я уверен, что мы сможем что-то реализовать.
Мы могли бы внедрить специфические трансформеры в определённых местах. Но я не вижу возможности добавить общий API, который позволил бы прикрепляться к любому элементу/компоненту.
Что касается обсуждения атрибута style=, я создал этот PR. Постараюсь добиться его ревью и слияния:
Спасибо. Пока всё хорошо с вашей текущей техникой; я адаптировал её для TLP, и она, похоже, работает отлично. Я вернусь, если обнаружу какие-либо потенциальные пробелы.
Отлично! Я должен быть готов к этому к моменту слияния, с нетерпением жду этого! Спасибо, Дэвид!
Разве не достаточно просто обновить синтаксис до нативного класса?