title: vue.js: Where to put regularly repeating background query
body: <p>I would like to query an API service every 15 seconds, so I can get data from a database and check whether something was changed. If there was a change, then my front end would update automatically because of how vue works.</p>
  <pre class="lang-js prettyprint-override"><code>while (true) {
      setTimeout(function() { 
          QueryService.orders().then(response =&gt; 
              this.orders = response.data
          )
      }, 15000)
  }
  </code></pre>
  <p>My questions are:</p>
  <ol>
  <li>Is this a good approach to solve such a problem at all?</li>
  <li>What would be the best position in the code to place such a loop?</li>
  </ol>
  <p><strong>EDIT:</strong></p>
  <p>Using <code>setInterval()</code> seems to be the right way, but using a polling function with <code>setInterval</code> in the created() hook doesn't affect the data-table at all. It shows me &quot;No data available&quot;:</p>
  <pre class="lang-js prettyprint-override"><code>data () {
      return {
          headers [
              { ... },
              { ... }
          ],
          orders: []
  }
  
  created () {
      setInterval(function() { 
          QueryService.orders().then(response =&gt; this.orders = response.data)
      }, 15000)
  }
  </code></pre>
  <p>Using the polling function without <code>setInterval</code> works and fills my data-table with data as usual:</p>
  <pre class="lang-js prettyprint-override"><code>created () {
      QueryService.orders().then(response =&gt; this.orders = response.data)
  }
  </code></pre>