从v-for中删除重复项

Question

我的项目有问题。它在过滤器列表上的重复项。

我要删除列表中所有重复的项目。

输出结果：

 export default {
  name: "ShowBlogs",
  data() {
    return {
      blogs: [],
      search: "",
      UnitType: "",
      PropertyName: "",
      areCommunity: "",
      AdType: ""
    };
  },

  created() {
    this.$http.get("http://localhost:3000/Listing").then(function(data) {
      console.log(data);

      this.blogs = data.body;
    });
  },

 computed: {
    filteredList() {
      const { blogs, search, UnitType } = this;
      return this.blogs
        .filter(blog => blog.Unit_Type.includes(this.UnitType))
        .filter(blog => blog.Community.includes(this.areCommunity))

        .filter(blog => blog.Ad_Type.includes(this.AdType));
    },
    };

<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.js"></script>

  <select
                      v-model="PropertyName"
                      id="formInput200"
                      class="form-control"
                      value="Buildingname"
                    >
                      <option disabled value>Building Name</option>
                      <option
                        v-for="blog in blogs"
                        v-bind:value="blog.Property_Name"
                        :key="blog.id"
                      >{{ blog.Property_Name}}</option>
                    </select>

如何将其从我的列表中删除？

Answer 1

正在处理此代码 谢谢@戴夫 enter image description here

<select
                  v-model="UnitType"
                  id="UnitType"
                  class="form-control"
                  aria-placeholder="Property type"
                >
                  <option disabled value>Property Type</option>
                  <option
                    v-for="blog in  filteradtype"
                    v-bind:value="blog.Unit_Type"
                    :key="blog.id"
                  >{{ blog.Unit_Type}}</option>
                </select>



 filteradtype() {
  return _.uniqBy(this.blogs, function(u) {
    return u.Unit_Type;
  });
},