title: How to fix TypeError in vue.js created hook?
body: <p>error:</p>
  
  <pre><code>vue.js:597 [Vue warn]: Error in created hook: "TypeError: handlers[i].call is not a function"
  
  found in
  
  ---&gt; &lt;StageExecs&gt;
  </code></pre>
  
  <p>vue.js</p>
  
  <pre><code>&lt;div id="vue-job"&gt;
      &lt;div class="row"&gt;
          &lt;h3&gt;test&lt;/h3&gt;
          &lt;stage-execs&gt;&lt;/stage-execs&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  
  &lt;script&gt;
      Vue.component('jobs', {
          delimiters: [ '[[', ']]' ],
          props: ['job'],
          data: function() {
                  return {
                      showExecs: false,
                      build_ids: []
                  }
              },
          created: {
              stageExecs() {
                  url = "api/v2/exec?" + this.job.api_url + "&amp;limit=10"
                  fetch(url)
                      .then(response =&gt; response.json())
                      .then(body =&gt; {
                          for(i=0; i&lt;body.length; i++){
                              this.build_ids.push({
                                  'id': JSON.stringify(body[i].build_id),
                              })
                          }
                      })
                      .catch( err =&gt; {
                          console.log('Error Fetching:', url, err);
                          return { 'failure': url, 'reason': err };
                      });
                  }
          },
          template: `
          &lt;ul id="example-1"&gt;
            &lt;li v-for="item in build_ids"&gt;
              [[ item.url ]]
            &lt;/li&gt;
          &lt;/ul&gt;
          `,
      });
  
  
  var v_root = new Vue({
      delimiters: [ '[[', ']]' ],
      el: '#vue-job',
      data: {
          job_exec: {{ job_exec|safe }},
  
      }
  });
  </code></pre>
  
  <p></p>
  
  <p>I assume something is being called in the incorrect order here, but new to vue.js so not sure what I did wrong.</p>