[Vuejs]-Is it possible to add HTML elements in which store some data in Vue?

With a few assumptions, I wrote an example of a similar scenario to yours. Of course, you would need to adjust it to your needs as I am not fully aware of the scope of your application.

<template>
  <div class="hello">
    <div class="buttons">
      <button
        v-for="(user, index) of getUniqueUsers"
        :key="user+index"
        @click="selectedUser=user"
      >User: {{user}}</button>
    </div>
    <ul v-if="selectedUser">
      <li
        v-for="(task, index) of archive.filter((user) => user.taskuserID==selectedUser)"
        :key="task+index"
      >
        <p>User: {{task.taskuserID}}</p>
        <p>Task: {{task.task}}</p>
      </li>
    </ul>
  </div>
</template>

<script>
export default {
  name: "HelloWorld",
  data() {
    return {
      selectedUser: null,
      archive: [
        {
          taskuserID: "1",
          task: "task1"
        },
        {
          taskuserID: "2",
          task: "task3"
        },
        {
          taskuserID: "1",
          task: "task3"
        },
        {
          taskuserID: "4",
          task: "task4"
        },
        {
          taskuserID: "5",
          task: "task1"
        }
      ]
    };
  },
  computed: {
    getUniqueUsers() {
      const uniqueUsers = [
        ...new Set(this.archive.map(user => user.taskuserID))
      ];
      return uniqueUsers;
    }
  }
};
</script>

<style scoped>
.buttons {
  display: flex;
  justify-content: space-around;
}
</style>

• In my example, I used a sample archive data property which is an array of objects where I store taskuserID
  and task.
• I used computed property to get a unique taskuserID from the archive
  array.
• Based on the return value from computed property (sorted array) I looped through unique users with v-for in order to create a button for each user.
• When you press on the button, in the loop below it will show all tasks completed by that specific taskuserID in a list. I used v-for for that with selectedUser data property that keeps track of the user who has been selected. Based on that value I filter the archive array in order to show all of the relevant tasks for the selected user.

Working Example