Closed 15992033543 closed 7 years ago
Hi, thanks for filling this issue. Please follow the Issue Reporting Guidelines and provide a live reproduction on jsfiddle, codepen etc. Thanks!
The fiddle isn't working, but it's most likely due to bootstrap-datepicker
only triggering a jQuery change event instead of a real change
event.
I use bootstrap datepicker with vue like this: https://jsfiddle.net/3a2055ub/
This is a wontfix for 2.0. Although we catered for it in 1.x, I don't think it makes sense for us to cater for the behavior of arbitrary 3rd party libraries - especially when there's a workaround like @Xelia's.
Sorry to tack onto a closed issue, but it's context related.
@yyx990803 Is using $("#startDate")
the optimal way to target an element within mounted()
? Should we be using something similar to refs
like in React?
Example:
const app = new Vue({
el: '#app',
data: {
startDate: '',
},
mounted() {
$('#startDate').datepicker().on(
'changeDate', () => { this.startDate = $('#startDate').val() }
)
}
})
@granda there is ref
(v-ref
in 1.0) exactly for that purpose. It's sufficient most of the time, but not always.
After making the datepicker
work I ran into another issue that is worth noting. I don't wanna see anyone suffer like I did!
So here is the situation, the application has a button that makes something true, then a v-if
shows a second datepicker
based on that true value. The mounted()
doesn't trigger again and second datepicker
shows the same weird behavior that we are discussing here! The workaround is to change v-if
with v-show
, so that mounted()
works for it in the first place.
https://jsfiddle.net/gLfesj48/