Vue: Vue updating data before or after click event depending on browser

[loki0609]

Vue.js version

v1.0.20

Reproduction Link

http://jsfiddle.net/5sH6A/468/

Steps to reproduce

Chrome/Firefox behave one way while IE 11/Edge behave a different way.

Chrome/Firefox - If you click on the check box changing it from a false to true state, vue DOES NOT update the row.selected value to true BEFORE the click event.

IE 11/Edge - If you click on the check box changing it from a false to true state, vue DOES update the row.selected value to true BEFORE the click event.

same thing going from true to false states

[yyx990803]

Different browsers trigger change and click events in different orders, this is not something Vue can change nor is Vue responsible for normalizing this behavior. You should be listening to the change event instead of click.

[katebe]

We solved this problem by wrapping our logic of the change-handler in Vue.nextTick. Then you always access the updated values.
Another solution could be a watcher on the property.

[stratboy]

Accepted answer should be Evan's one. That works in every case.