Question

我在Nuxt JS应用程序中使用的是最新版本的Vue Carousel。似乎每当对Nuxt JS使用universal模式时，我的每篇博客文章都会出错。如果我取出Vue Carousel并执行标准的v-for循环，则博客显示的很好，使用转盘时会引起错误。

我的代码：

<carousel :paginationEnabled="false" :navigationEnabled="true" :perPageCustom="[[250, 1], [1024, 2]]">
              <slide v-for="blog in blogs.blogs" :key="blog.id" v-if="currentBlogDate >= blog.created && blog.created">
                <b-card class="text-center m-3 p-0 p-md-3">
                  <h4 class="display-4 font-weight-normal mb-3">{{ blog.title | striphtml | truncate(32, '...') }}</h4>
                  <b-card-text class="text-muted">{{ blog.body | striphtml | truncate(32, '...') }}</b-card-text>
                  <b-button :to="'/posts/view/' + blog.title" size="sm" variant="primary">Read More<i class="fas fa-angle-right pl-2"></i></b-button>
                </b-card>
              </slide>
            </carousel>

错误：

TypeError: Cannot read property 'indexOf' of undefined

Answer 1

似乎您的组件未针对服务器端渲染进行优化。

请记住，Nuxt.js通用服务器端渲染期间既没有window也没有document对象。

为您提供的快速解决方案-用<no-ssr></no-ssr>组件包装SSR不兼容的组件。

https://nuxtjs.org/api/components-no-ssr#the-lt-no-ssr-gt-component

使用Vue Carousel时无法读取未定义的属性'indexOf'

1 个答案: