title: Vuetify data table in single-select mode, selecting one row selects all others
body: <p>I am trying to select one row in the table and emit the selected item.</p>
  
  <p>Selecting one selects all but only the first encountered object is saved to the model (as <code>selected</code> variable).</p>
  
  <p>Do you have any ideas, what i'm doing wrong?</p>
  
  <p><a href="https://i.stack.imgur.com/uLRsw.gif" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/uLRsw.gif" alt="enter image description here"></a></p>
  
  <pre class="lang-js prettyprint-override"><code>&lt;template&gt;
    &lt;v-data-table
      :headers="headers"
      :items="items"
      :search="search"
      :loading="loading"
      v-model="selected"
      single-select
      show-select
      :options="{itemsPerPage:5}"
      @item-selected="itemSelected"
    &gt;
      &lt;template v-slot:top&gt;
        &lt;v-toolbar flat&gt;
          &lt;v-text-field
            v-model="search"
            append-icon="mdi-magnify"
            label="Search"
            single-line
            hide-details
          &gt;&lt;/v-text-field&gt;
        &lt;/v-toolbar&gt;
      &lt;/template&gt;
  
      &lt;template v-slot:item.name="{ item }"&gt;{{ item.name }}&lt;/template&gt;
    &lt;/v-data-table&gt;
  &lt;/template&gt;
  
  &lt;script&gt;
  export default {
    name: "variable-selector",
    props: ["variables", "map", "index"],
    data() {
      return {
        search: "",
        selected: {},
        loading: false,
        items: [],
        headers: [{ text: "Variable name", value: "name", sortable: true }]
      };
    },
    methods: {
      itemSelected(selection) {
        if (selection.value) {
          this.$emit("selected", selection.item); // it always emits var_2 object
        } else {
          this.$emit("selected", null);
        }
      },
  
      updateItemsList(variables) {
        this.items = Array.from(variables);
      }
    },
  
    mounted() {
      this.updateItemsList(this.variables);
    },
  
    watch: {
      variables(newValue) {
        this.loading = true;
        this.updateItemsList(newValue);
        this.loading = false;
      }
    }
  };
  &lt;/script&gt;
  </code></pre>