[Vuejs]-I want to display an array value based on the condition of another array value. What is the best way of doing this?

0👍

Your filterUser property is returning an array of users if the user is an admin, but a single user otherwise. Change filterUser so that in both cases it either returns an array or a single user object.

In this case, you expect to only have one admin user in the array, so you can use currentUser.find instead of currentUser.filter to return only the admin user.

 filterUser() {
    if(this.currentUser.systemAdmin) {
      return this.currentUser.find(user => user.systemAdmin)
    } else {
      return this.currentUser
    }
  },

Now that filterUser is returning a single user, you can remove the v-for from b-row and display the single user’s name:

<b-row>
   <b-col class="text-center">
      <h2>{{ $t('welcomeTo') + ' ' }}<span style="color: #31a58e">website name</span> {{' ' + filterUser.name }}</h2>
   </b-col>
</b-row>

Leave a comment