在vuejs中根据价格（产品的mrp）对产品进行排序

Question

** 示例数据
商店产品 = [
{ Pname: '肥皂', 最低工资：50 },
{ Pname: '洗脸', 会员价：30 },
{ Pname: '洗发水', 商品价格：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;
    }
  });
}