В моем Vue проекте, который я использую jquery, он не загружается, когда я использую маршрутизацию, и он будет загружаться только тогда, когда перезагрузится полная страница

Question

В моем Vue проекте jquery не работает должным образом, когда refre sh страница загружается должным образом, но когда я нажимаю на другие страницы, он не будет работать, если я refre sh этой страницы это будет работать, я использовал vue роутеры (ленивая загрузка-роутер-линк). это необходимо для ползунков из (owl-carousel).

Router. js file

import Vue from "vue";
import VueRouter from "vue-router";
import Home from "../views/Home.vue";

Vue.use(VueRouter);

const routes = [
    {
        path: "/",
        name: "Home",
        component: Home,
    },
    {
        path: "/about",
        name: "About",
        // route level code-splitting
        // this generates a separate chunk (about.[hash].js) for this route
        // which is lazy-loaded when the route is visited.
        component: () =>
            import(/* webpackChunkName: "about" */ "../views/About.vue"),
    }
];

const router = new VueRouter({
    routes,
    base: process.env.BASE_URL,
    mode: "history", 
});

export default router;

Теперь я использую в приложении. vue

<template>
//code
</template>
<script>
import "./assets/plugins/owl-carousel/owl.carousel.css";
import "./assets/plugins/owl-carousel/owl.carousel.js";
import "./assets/js/jquery-3.2.1.min.js";
// pages imported
import Home from "./views/Home";
import About from "./views/About";
export default {
    name: "App",
    components: {
        Home,
        About,
},
};

$(document).ready(function() {
    $(".custom1").owlCarousel({
        animateOut: "slideOutDown",
        animateIn: "flipInX",
        items: 1,
        margin: 30,
        stagePadding: 30,
        smartSpeed: 450,
    });
});

</script>