您好,我遇到了 Nuxts ssr 问题。我试图将“vue-slick”添加到我的网络应用程序中,无论我做什么,它都会继续显示“窗口未定义”。
如您所见,我尝试了多种方法来允许在客户端加载 vue-slick。使用插件没有帮助,在我的组件中使用 process.client 也不起作用。
组件/Carousel/Carousel.vue
<template>
<div class="carousel">
<Slick ref="slick" :options="slickOptions">
<a href="http://placehold.it/320x120">
<img src="http://placehold.it/320x120" alt="">
</a>
...
<a href="http://placehold.it/420x220">
<img src="http://placehold.it/420x220" alt="">
</a>
</Slick>
</div>
</template>
<script>
if (process.client) {
require('vue-slick')
}
import Slick from 'vue-slick'
export default {
components: {
Slick
},
data() {
return {
slickOptions: {
slidesToShow: 4
},
isMounted: false
}
},
methods: {
}
}
</script>
Run Code Online (Sandbox Code Playgroud)
nuxt.config.js
plugins: [
{ src: '~/plugins/vue-slick', ssr: false }
],
Run Code Online (Sandbox Code Playgroud)
插件/vue-slick
import Vue from …Run Code Online (Sandbox Code Playgroud)