Prevent rerender of child components that use $listeners (fix #7257)

[Domino9697]

Issue

Reproduction link

https://jsfiddle.net/xb4172g8/

Steps to reproduce

Open console and observe while typing something into input fields
Enter some text into name field -> Vue re-renders all three Textfield components
In line 21 replace { ...this.$listeners } with an empty object
Once again enter some text into any field -> Vue re-renders only updated Textfield

Child components that use the $listeners attribute are rerendered each time the parent component is
updated. This is due to the updateChildComponent function that sets the reactive property
vm.$listeners thus triggering a rerender of the child component.

Solution

One possible solution would be to compare the new listeners with the previous listeners. But since these are javascript functions, we cannot compare them.
It is important to note however that the listeners of the child component are updated later within the updateChildComponent function. Updating the vm.$listeners attribute should therefore not trigger any of the subscribers as the virtual DOM is eventually updated later on.

This change therefore provides a new toggleNotifyingSubscribers method that disables a reactive property's ability to notify its subscribers. We use this method to prevent the vm.$listeners property from rerendering the child component.

fix #7257

What kind of change does this PR introduce? (check at least one)

• Bugfix
• Feature
• Code style update
• Refactor
• Build-related changes
• Other, please describe:

Does this PR introduce a breaking change? (check one)

• Yes
• No