[Vuejs]-Filter v-for on results of mysql join query

by

0👍

✅

Perhaps you could use a computed property with the array method reduce to sort your comments ..

computed: {
  sortedComments() {
    return this.comments.reduce((cum, next) => {
      const lastCommentArray = cum[cum.length - 1]
      if (cum.length == 0 ||
          next.content != lastCommentArray[lastCommentArray.length - 1].content) {
        cum.push([])
      }
      cum[cum.length - 1].push(next)
      return cum
    }, [])
  }
}

Then you could iterate over it like this ..

<div v-for="commentArray in sortedComments" :key="commentArray[0].content">
  <p>{{commentArray[0].content}}</p>
  <p v-for="reply in commentArray" :key="reply.reply_content">{{reply.reply_content}}</p>
</div>
👤Husam Ibrahim

Leave a comment