小编The*_*der的帖子

窗口未定义 Nuxt for vue-slick

您好,我遇到了 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)

vue.js slick.js nuxt.js

2
推荐指数
1
解决办法
6859
查看次数

标签 统计

nuxt.js ×1

slick.js ×1

vue.js ×1