Nuxt.js: Scoped slots together with async component breaks SSR

Created on 17 Sep 2019  路  10Comments  路  Source: nuxt/nuxt.js

Version

v2.9.2

Reproduction link

https://github.com/bdrtsky/scoped-slots-ssr-issue

Steps to reproduce

If you use scoped slot and it's child, that is async imported, then child content doesn't gets SSR'd.

if you remove scoped slot component OR use scoped slot with regular component import then it's SSR'd just fine.

What is expected ?

Expect server rendered content.

What is actually happening?

Content is not server rendered.

This bug report is available on Nuxt community (#c9783)
bug-report stale

All 10 comments

If you insert any html element along with async component in scoped slot, then this component is SSR'd fine:

<damned-scoped-slot :items="[content]">
      <template v-slot="{ lazyItems: lazyArticles }">
          <span>ssr hack</span>
          <async-comp />
      </template>
</damned-scoped-slot>

Does that also happen with the pure vue-server-renderer?

Not sure I can reproduce it with vue-server-renderer...
You think it could be vue-server-renderer issue?

I also have this problem when using tables in element-ui!

I write the following in \

    <el-table v-loading="loading" :data="tableData" style="width: 100%" highlight-current-row
      @current-change="selectNovel">
      <el-table-column prop="name" label="col_1">
      </el-table-column>
      <el-table-column prop="author" label="col_2">
      </el-table-column>
    </el-table>

and get tableData in asyncData function like this

  asyncData(context) {
    return axios.get("http://localhost:2816/api/data?source=0")
      .then((res) => {
        let {
          data
        } = res.data
        return {
          tableData: data
        };
      })
  },

it works well when I allow js in chrome. But when I turn javascript off, the table component cannot be render.

However, when I use {{tableData}} in \

@bdrtsky Yes, this could be. A newcomer-friendly way to get started with the pure vue-server-render can be found @ https://ssr.vuejs.org/guide/#installation

Ok, I will try to reproduce with Vue SSR

Thanks for your contribution to Nuxt.js!
This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs.
If you would like this issue to remain open:

  1. Verify that you can still reproduce the issue in the latest version of nuxt-edge
  2. Comment the steps to reproduce it

Issues that are labeled as pending will not be automatically marked as stale.

Hey bot, I can still reproduce this, but didn't had time to try it with Vue SSR yet. Will do next weekend, I hope.

Thanks for your contribution to Nuxt.js!
This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs.
If you would like this issue to remain open:

  1. Verify that you can still reproduce the issue in the latest version of nuxt-edge
  2. Comment the steps to reproduce it

Issues that are labeled as pending will not be automatically marked as stale.

Was this page helpful?
0 / 5 - 0 ratings

Related issues

nassimbenkirane picture nassimbenkirane  路  3Comments

VincentLoy picture VincentLoy  路  3Comments

msudgh picture msudgh  路  3Comments

danieloprado picture danieloprado  路  3Comments

vadimsg picture vadimsg  路  3Comments