vue计算属性实现过滤+排序

上代码！！！

export default {
  components: { Nav },
  props: {},
  data() {
    return {
      filterIndex: 2, //0代表原本顺序，1代表降序，2代表升序
      searchName: "", //搜索名字
      list: [
        //过滤前的数组
        { name: "one", age: "18" },
        { name: "two", age: "16" },
        { name: "three", age: "19" },
        { name: "four", age: "17" },
      ],
    };
  },
  computed: {},
  computed: {
    filterList() {
      //监听filterList是否发生改变
      const { searchName, list, filterIndex } = this;
      let newFilterList; //定义一个最新的数组
      newFilterList = list.filter((v) => {  //过滤后返回给 newFilterList      
        return v.name.indexOf(searchName) != -1; //过滤条件
      });
      if (filterIndex != 0) {//不是原本顺序
        newFilterList.sort((v1, v2) => {
          if (filterIndex == 1) {    
            return v1.age - v2.age;  //降序
          } 
          else {   
            return v2.age - v1.age; //升序
          }
        });
      }
      return newFilterList; //返回newFilterList给监听的属性
    },
  },
  methods: {
    setAgeIndex(index){  //排序状态赋值
    this.filterIndex=index
    },
  },
  watch: {},

  // 页面周期函数--监听页面加载
  onLoad(options) {},
  // 页面周期函数--监听页面初次渲染完成
  onReady() {},
  // 页面周期函数--监听页面显示(not-nvue)
  onShow() {},
  // 页面周期函数--监听页面隐藏
  onHide() {},
  // 页面周期函数--监听页面卸载
  onUnload() {},
};

以上代码实现