title: very simple vue.js component generate maximum call stack size exceeded
body: <p>I have a very simple vue.js component which display list of data (2 objects with 2 fields).</p>
  
  <p><strong>component vue.js code :</strong> </p>
  
  <pre><code>    &lt;template&gt;
  
      &lt;div&gt;
  
          &lt;h1&gt;Genre&lt;/h1&gt;
  
          &lt;b-container&gt;
              &lt;b-row&gt;
                  &lt;b-col v-for="data in genre" v-bind:key="data.id" v-bind:title="data.name"&gt;
                      &lt;b-card title="fefefe"
                              tag="genre"
                              style="max-width: 20rem;"
                              class="mb-2"&gt;
                      &lt;/b-card&gt;
                  &lt;/b-col&gt;
              &lt;/b-row&gt;
          &lt;/b-container&gt;
  
      &lt;/div&gt;
  
  &lt;/template&gt;
  
  &lt;script&gt;
  
      export default
      {
          name: 'genre',
  
          data: function ()
          {
              return {
                  genre: [
                      {id:1, name:'toto'},
                      {id:2, name:'tata'},
                  ]
              }
          },
      }
  &lt;/script&gt;
  
  &lt;style scoped&gt;
  
  &lt;/style&gt;
  </code></pre>
  
  <p>But when I displayed this component I have a error :</p>
  
  <blockquote>
    <p>[Vue warn]: Error in nextTick: "RangeError: Maximum call stack size
    exceeded"</p>
  </blockquote>
  
  <p>I don't understand why my loop "for" throws that error dealing with my few data.
  I have another component that retrieve data by SQL promise (on mounted()) and I don't generate this error. Moreover I have more data for this component but no call stack error. This is very strange for me.</p>
  
  <p>What nicety I forget ?</p>