Iconify не реагирует на изменения в DOM - PullRequest
0 голосов
/ 24 июня 2019

Атрибут 'data-icon' (управляет отображаемым значком) изменяется при нажатии моей кнопки, однако iconify, похоже, не обновляет значок.

Я безуспешно пытался приостановить и отменить приостановку наблюдателя мутаций.

В голове

<script src="https://code.iconify.design/1/1.0.2/iconify.min.js"></script>

В теле

<span class="iconify chevron" data-icon="jam:chevron-down" data-inline="false" onclick="expand(0)"></span>

внешний Js

function expand(num) {
  var chevron = document.getElementsByClassName('chevron');
  var direction = chevron[num].getAttribute('data-icon');

  if (direction == 'jam:chevron-down') {
    chevron[num].setAttribute('data-icon','jam:chevron-up');

   } else {
    chevron[num].setAttribute('data-icon','jam:chevron-down');
   }
}

Я ожидаю, что значок изменится с шеврона вниз на вверх. Фактический вывод - это без изменений в данных SVG, однако правильный измененный атрибут.

Я не уверен, возможно ли вообще заменить значок, так как скрипт переключает диапазон заполнителя с помощью svg.

Вместо этого я попытался изменить класс, который также должен изменить значок, но обновление все равно не было.

РЕДАКТИРОВАТЬ: Чтобы преодолеть это, я просто заменил сам диапазон с новым значком, например:

<span class="iconify chevron" data-icon="jam:chevron-down" data-inline="false" onclick="expand(0)"></span>

to 

<span class="iconify chevron" data-icon="jam:chevron-up" data-inline="false" onclick="expand(0)"></span>

с использованием .innerHTML в родительском div.

Кажется, что Iconify только сканирует диапазон заполнителей, это означает, что он не распознает обновления атрибутов нового svg.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...