如何才能实现这个功能?最好配合路由勾子实现,不然应该会在一个页面加载后,其他页面不点击刷新应该会一直保留加载的js
首先,要在 Vue 3 中加载 CDN 的 JS,你需要在项目的 HTML 文件中引入这些 JS 文件。在 Vue 3 中,你需要在 main.js
或 main.ts
文件中引入你的 JS 文件。
例如,如果你有一个叫做 my-script.js
的 JS 文件,你可以在 main.js
或 main.ts
文件中这样引入:
import './my-script.js'
如果你想在特定页面加载这个 JS,你可以在那个页面的 Vue 组件中引入这个 JS。例如,如果你有一个叫做 MyPage.vue
的页面组件,你可以在这个组件中这样引入:
<script src="./my-script.js"></script>
如果你想在路由切换时加载这个 JS,你可以使用 Vue Router 的导航守卫。你可以在全局导航守卫(beforeEach
)或特定路由的守卫(beforeEnter
)中引入这个 JS。例如:
const router = createRouter({
history: createWebHistory(),
routes: [
{
path: '/my-page',
component: MyPage,
beforeEnter: (to, from, next) => {
import('./my-script.js')
.then(() => next())
.catch(() => next())
}
}
]
})
请注意,上述示例中的 import('./my-script.js')
会导致页面在加载时阻塞,直到 JS 文件加载完成。如果你想避免这种情况,你可能需要使用动态导入(import()
)和异步组件。
10 回答11.1k 阅读
6 回答3k 阅读
5 回答4.8k 阅读✓ 已解决
4 回答3k 阅读✓ 已解决
2 回答2.6k 阅读✓ 已解决
3 回答5.1k 阅读✓ 已解决
3 回答1.8k 阅读✓ 已解决
import()
<script>
到页面至于保留加载的 JS,没什么问题,并不会影响其它代码。