QSlideItem: Problem when deleting item from list by sliding

dirkhd

I bind an array to a QList with QSlideItems. When sliding to left I want the item to be deleted.
That works fine, no problem so far.

But now the next item in the list is automatically shown as slided after the other item is deleted.

Is it indeed necessary to use ‘reset’ each time or do I overlook something?

<q-list v-for="(activity, index) in activities" :key="index" bordered separator>
        <q-slide-item left-color="red" @left="opt => resetActivity(opt,index)">

methods: {
    pushChange() {
      localStorage.activities = JSON.stringify(this.activities);
    },
    resetActivity({ reset }, index) {
      this.finalize(reset);
      setTimeout(() => {
        this.activities.splice(index, 1);
      }, 0);
    },
    finalize(reset) {
      this.timer = setTimeout(() => {
        reset();
      }, 0);
    },
    deleteActivity(index) {
      this.activities.splice(index, 1);
    },
    addNewActivity() {
      this.activities.push({
        content: this.activities.length + " New Activity",
        done: false
      });
    }
  },
  beforeDestroy() {
    clearTimeout(this.timer);
  },

Best regards and a great 2020
Dirk

s.molinari

I don’t know why it works other than learning sometimes you need a better more unique value for the key, and I didn’t figure this out myself. But, use a more unique key for the v-for. (thanks goes to @metalsadman for helping me solve this too).

https://codepen.io/smolinari/pen/GRgMGNL?editors=1000

Scott

dirkhd

Dear Scott,

Thank you so much - guess I could never figure this out by myself!

Best
Dirk

s.molinari

That’s what community is all about!

Scott