按价格(产品的mrp)按vuejs分类产品。

Question

**样本数据

storeProducts =[

{名称：“soap”，mrp: 50 }，

{名称：“facewash”，mrp: 30 }，

{名称：“洗发水”，mrp: 100 }

]；

**我试图根据storeProducts价格对产品进行分类，我尝试过一些东西，有人能让我知道怎么做吗？

  <div class="mt-4">
            <div class="column" v-if="storeProducts.length !== 0">
              <div class="control is-pulled-right">
                <div class="select">
                 <select v-model="sortBy" v-on:change="filteredProduct">
                    <option value="1">Low to High(Price)</option>
                    <option value="2">High to Low(Price)</option>
                  </select>
                </div>
              </div>
            </div>
          </section>
      </div>
</template>

<script>
export default {
  name: 'ProductBySubCategory',
  components: {
    ProductTile,
  },
  data() {
    return {
      products: [],
      storeProducts: [],
      sortBy: 1,
    };
  },
  methods: {
    getRenamedProducts(products) {
      return products.map((prod) => {
        return {
          id: prod.id,
          title: prod.title,
          mrp: prod.mrp,
          realUnit: prod.unit,
        };
      });
    },
  },
  computed: {
     filteredProduct: function () {
      return this.storeProducts.sort((a, b) => {
      if (this.sortBy == '1') {
     return b.mrp - a.mrp;
        } else if (this.sortyBy == '2') {
         return a.mrp - b.mrp;
         }
    });
     },
  },
};
</script>```

Answer 1

试试这个：

filteredProduct: function() {
  const sortBy = this.sortBy;
  return this.storeProducts.sort((a, b) => {
    if (sortBy === '1') {
      return b.mrp - a.mrp;
    } else if (sortBy === '2') {
      return a.mrp - b.mrp;
    }
  });
}