title: Why is Vuetify Data table not updating correctly?
body: <p>So I'm populating the data table with items fetched via API and it is working fine, but if I want to edit any of the fields it's not quite working out.</p>
  
  <p>The item only updates if I manually do something like search or sort. (inside the data table)</p>
  
  <p>The fields I'm trying to modify are <code>item.tuning</code> and <code>item.url</code> via getTab()</p>
  
  <pre><code>&lt;v-data-table 
  class="tableElem"
  :headers="headers"
  :items="playlist"
  :loading="loadingPlaylist"
  :search="search"
  :pagination.sync="pagination"
  :rows-per-page-items="[15]"
  hide-actions
  &gt;
  &lt;v-progress-linear slot="progress" color="purple" indeterminate&gt;&lt;/v-progress-linear&gt;
  &lt;template slot="items" slot-scope="props"&gt;
    &lt;td&gt;{{ props.item.artist }}&lt;/td&gt;
    &lt;td class="text-xs-right"&gt;{{ props.item.track }}&lt;/td&gt;
    &lt;td class="text-xs-right"&gt;{{ props.item.tuning | tuning }}&lt;/td&gt;
    &lt;td class="text-xs-right"&gt;
      &lt;v-btn 
      v-if="props.item.url" 
      depressed outline light 
      style="margin-top:1rem;margin-bottom:1rem;" 
      :href="props.item.url" 
      target="!blank"&gt;
        Tab
      &lt;/v-btn&gt;
      &lt;div class="text-xs-center" v-else-if="props.item.url == false"&gt;No tab :(&lt;/div&gt;
      &lt;v-btn 
      v-else 
      depressed outline light 
      style="margin-top:1rem;margin-bottom:1rem;" 
      v-on:click="getTab(props.item.artist, props.item.track, props.item)"&gt;
        Get Tab
      &lt;/v-btn&gt;
    &lt;/td&gt;
  &lt;/template&gt;
  &lt;v-alert slot="no-results" :value="true" style="color:black;" icon="warning"&gt;
    Your search for "{{ search }}" found no results.
  &lt;/v-alert&gt;
  &lt;/v-data-table&gt;
  </code></pre>
  
  <p>methods:</p>
  
  <pre><code>getTab(artist, track, item) {
    //const tabURL = "https://stark-beyond-77127.herokuapp.com/spotify/gettab";
    let itemIndex = this.playlist.indexOf(item)
    const tabURL = "http://localhost:5000/spotify/gettab";
    const tabJSON = {
      artist: artist,
      track: track
    };
    axios.post(tabURL, tabJSON).then(response =&gt; {
      let tuning = response.data[0].tuning;
      let url = response.data[0].url;
      this.playlist[itemIndex] = { ...this.playlist[itemIndex], ...{ tuning: tuning, url: url } };
      console.log(this.playlist[itemIndex]);
    });
  }
  </code></pre>
  
  <p>My guess here is that I'd have to use computed: or watch: but dont know how to implement that.
  Thanks</p>