How can i exclude some element from my array? (vue.js)

Question

So, basically i use an HTML select filled with the arrays of registered users

<label >
  <b>
    <i style="opacity:0.8">Users:</i>
  </b>
</label>&nbsp;&nbsp;
<select
  class="form-control w-50 mb-5"
  style="display:inline;"
  v-model="filter"
  @change="userfilter"
>
  <option id="userbox" v-for="user in userlist" :key="user.userlist">{{user}}</option>
  <option>All</option>
</select>

than with v-model="filter" i set the filter value that initially is empty

export default {
name: "completed",
data() {
return {
  filter: "",
  userlist: "",
  archive: [],
  supportarchive: [],
  selecteduser: ""
};
},

I have also created a suppor-tarray supportarchive:[] which function is to fill the original array when this condition result true:

methods: {
userfilter: function() {
  this.selecteduser = this.filter;
  if (this.filter == "All") {
    this.supportarchive=[];
    this.archive = JSON.parse(localStorage.getItem("completedtasks"));
  } else {
    this.supportarchive = this.archive;
    this.archive = [];
    for (let i = 0; i < this.supportarchive.length; i++) {
      if (this.supportarchive.taskuserID == this.selecteduser) {           
        this.archive.push(this.supportarchive[i]);
      }
     }
    }
   }
  }

Ok so if the filter is all then i fill my array from the localStorage but if the filter has another value then i do a backup of my original array archive in supportarchive, then i empty the original one and if the condition is meeted i push the element of my supportarchive into my original one archive but it doesn't work and i don't know why

jakob_a · Accepted Answer · 2020-06-25 08:41:57Z

1

Is this.supportarchive an object and not an array? Then it has no length property and won't work in the loop.

One solution is to get the object keys and loop based on those;

var keys = Object.keys(this.supportarchive)
var tempArr = []
for (let i = 0; i < keys.length; i++) {

  let item = this.supportarchive[keys[i]];

  if (item.taskuserID == this.selecteduser) {
    // You should put this into a new temporary array.
    // Dont change the array you are looping
    // this.archive.push(this.supportarchive[i]);

    tempArr = item
  }
}

// Parse back into json
this.archive = JSON.parse(tempArr);

answered Jun 25, 2020 at 8:41

jakob_a

1261 silver badge6 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

MUHAMMAD ILYAS · Accepted Answer · 2020-06-25 08:52:40Z

0

in your code do something like this.supportarchive[i].taskuserID

methods: {
userfilter: function() {
  this.selecteduser = this.filter;
  if (this.filter == "All") {
    this.supportarchive=[];
    this.archive = JSON.parse(localStorage.getItem("completedtasks"));
  } else {
    this.supportarchive = this.archive;
    this.archive = [];
    for (let i = 0; i < this.supportarchive.length; i++) {
      if (this.supportarchive[i].taskuserID == this.selecteduser) {           
        this.archive.push(this.supportarchive[i]);
      }
     }
    }
   }
  }

Recommended method use filter on array

this.archive = this.supportarchive.filter(u => u.taskuserID === this.selecteduser);

answered Jun 25, 2020 at 8:52

MUHAMMAD ILYAS

1,4409 silver badges23 bronze badges

Collectives™ on Stack Overflow

How can i exclude some element from my array? (vue.js)

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related