No More Posting New Topics!

If you have a question or an issue, please start a thread in our Github Discussions Forum.
This forum is closed for new threads/ topics.

Navigation

    Quasar Framework

    • Login
    • Search
    • Categories
    • Recent
    • Tags
    • Popular
    • Users
    • Groups
    • Search

    QSlideItem: Problem when deleting item from list by sliding

    Help
    2
    4
    337
    Loading More Posts
    • Oldest to Newest
    • Newest to Oldest
    • Most Votes
    Reply
    • Reply as topic
    Log in to reply
    This topic has been deleted. Only users with topic management privileges can see it.
    • D
      dirkhd last edited by

      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

      1 Reply Last reply Reply Quote 0
      • s.molinari
        s.molinari last edited by 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

        1 Reply Last reply Reply Quote 0
        • D
          dirkhd last edited by

          Dear Scott,

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

          Best
          Dirk

          1 Reply Last reply Reply Quote 0
          • s.molinari
            s.molinari last edited by

            That’s what community is all about! 😄

            Scott

            1 Reply Last reply Reply Quote 0
            • First post
              Last post