Vue過濾器實現根據分類id顯示分類名稱

在開發中遇到的問題

獲取的信息展示列表，但是獲取的對應的信息中有對應的分類信息的顯示，手中只有每個條目的分類id，展示想要展示分類名稱，可以用過濾器實現

Vue.filter('showCateName',function(cat_id,cates){
  const catObj = cates.filter(item => item.cat_id==cat_id)
  if(catObj.length!=0){
    return catObj[0].cat_name
  }else{
    for(var cat of cates){
      if(cat.children.length!=0){
        const ret = cat.children.find(item=>item.cat_id==cat_id)
        if(ret){
          return ret.cat_name
        }
      }
    }
  }
})

思路

1. 通過請求獲取所有的一級分類及二級分類
2. 功過find或者filter函數查找分類，並將分類名稱返回即可

數據類似這種結構，上面的處理方法是針對下面的數據適用

 {
            "cat_id": 1,
            "cat_name": "大家電",
            "cat_pid": 0,
            "cat_level": 0,
            "cat_deleted": false,
            "children": [
                {
                    "cat_id": 3,
                    "cat_name": "電視",
                    "cat_pid": 1,
                    "cat_level": 1,
                    "cat_deleted": false,
                    "children": [
                        {
                            "cat_id": 6,
                            "cat_name": "曲面電視",
                            "cat_pid": 3,
                            "cat_level": 2,
                            "cat_deleted": false
                        },
                        {
                            "cat_id": 7,
                            "cat_name": "海信",
                            "cat_pid": 3,
                            "cat_level": 2,
                            "cat_deleted": false
                        }
                    ]
                }
            ]
        }