computed property "activeItems" done.

computed_property.vue

<template>
  <div class="widget">
    <div v-if="activeItems && activeItems.length > 0">
      <ul>
        <li v-for="item in activeItems" :key="item.id">
          {{ item.name }}
        </li>
      </ul>
    </div>
  </div>
</template>
<script>
export default {
  data() {
    return {
      loading: true,
      list: {
        John: true,
        Jane: true,
        Bob: false,
      },
    };
  },
  computed: {
    activeItems() {
      var arr_list = [];
      for (const [key, value] of Object.entries(this.list)) {
        if (value) {
          var val = {
            name: key,
            active: value,
          };
          arr_list.push(val);
        }
      }
      return arr_list;
    },
  },
};
</script>