Join GitHub today
GitHub is home to over 31 million developers working together to host and review code, manage projects, and build software together.Sign up
Custom directive binds differs on components vs elements #9876
Steps to reproduce
What is expected?
Directive will emit the same console messages when applied to DOM elements and to components (on init and after click on button).
I'm not sure what should be expected output. Either
What is actually happening?
Messages from the directive are the same on init, but different after button have been clicked.
Actual console output:
It seems that order in which directives are applied to DOM elements and components are different. In my setup I have custom directive which relies on some DOM attribute with configuration data. When this custom directive is bound/unbound in a "regular flow" – everything works as expected (directive binds after element attributes are updated). However when directive is bound/unbound in case of Vue "in-place patch strategey", behavior seems to be different.
The optimization is based on that you have stateless elements so Vue won’t bother to take care of correctly managing event handlers or local states when trying to reuse an element. So I think this is not a bug but can be potentially improved in our docs so that our users can understand this more easily.
@Justineo I understand the concepts behind an optimization itself. In my situation, custom directive is responsible for adding the state attribute to element on