QSlideItem: Problem when deleting item from list by sliding



  • 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



  • 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



  • Dear Scott,

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

    Best
    Dirk



  • That’s what community is all about! 😄

    Scott


Log in to reply