Home

Issue: 568

Server render error RangeError: Maximum call stack size exceeded

[issue link]

screen shot 2560-04-14 at 9 11 18 pm

I got this error when I use v-for dynamic components on server side render.
If data less then 10 records it’s work fine and use client render it’s work too.
Error only use server side render. How do I solve?

<component v-for="element in dataItems" :is="element.name" :key="element.id"></component>
here is my json data

[
  {
    "id": "1",
    "name": "Layout12"
  },
  {
    "id": "2",
    "name": "Layout12"
  },
  {
    "id": "3",
    "name": "Layout12"
  },
  {
    "name": "Layout12",
    "id": "4"
  },
  {
    "name": "Layout12",
    "id": "5"
  },
  {
    "name": "Layout12",
    "id": "6"
  },
  {
    "name": "Layout12",
    "id": "7"
  },
  {
    "name": "Layout12",
    "id": "8"
  },
  {
    "name": "Layout12",
    "id": "9"
  },
  {
    "name": "Layout12",
    "id": "10"
  }
]
This question is available on Nuxt.js community (#c495)