I do not know jQuery in vue correct usage. When I refresh page, $(document).ready() has a role. But when I switch the page through vue-router, $(document).ready() does not work.
import $ from 'jquery'
export default {
name: 'photo',
data() {
return {
photos: [
{},{},{},{},{}
]
}
}
}
$(function () {
console.log('something')
})
解决方案
Instead of relying on $(document).ready() in a vue webapp, you can use one of the lifecycle hooks for this purpose. You can try using mounted as it comes pretty close to $(document).ready():
Called after the instance has just been mounted where el is replaced by the newly created vm.$el. If the root instance is mounted to an in-document element, vm.$el will also be in-document when mounted is called.
You can hook it like this:
export default {
name: 'photo',
data() {
return {
photos: [
{},{},{},{},{}
]
}
},
mounted () {
console.log('something')
}
}