Vue: Связывание пользовательской директивы отличается для компонентов и элементов

Похоже, что директива вызывается со старым компонентом (потому что он используется повторно), но у нее все еще есть старые атрибуты

В качестве обходного пути установите ключ на одном из компонентов

@bponomarenko
То, что сказал описано в документации.
Вы можете сослаться на это.

https://vuejs.org/v2/guide/conditional.html#Controlling -Reusable-Elements-with-key

@posva @pistis Спасибо за ответ. Да, это то, что мы в конечном итоге использовали в качестве обходного пути, я должен был упомянуть об этом в заявке. Однако наличие атрибута key не позволит использовать оптимизацию рендеринга Vue.js. Было бы здорово исправить это.

Оптимизация основана на том, что у вас есть элементы без состояния, поэтому Vue не будет заботиться о правильном управлении обработчиками событий или локальными состояниями при попытке повторно использовать элемент. Так что я думаю, что это не ошибка, но потенциально может быть улучшено в наших документах, чтобы нашим пользователям было легче понять это.

@Justineo Я понимаю концепции самой оптимизации. В моей ситуации настраиваемая директива отвечает за добавление атрибута состояния к элементу в bind и удаление этого атрибута в unbind . И директива отлично добавляется / удаляется, когда компонент повторно используется Vue.js. Однако порядок обновления свойств компонентов и инициализации директив различается в разные моменты времени жизни компонента, что затрудняет разработку собственных директив.
Действительно, дополнительная документация по этим методам оптимизации может быть полезна, но, на мой взгляд, несовместимые события жизненного цикла директив - это скорее ошибка, которую нужно исправить.

В качестве обходного пути установите ключ на одном из компонентов