uniapp-一些ES6新特性的使用来减少if else的使用

394 阅读1分钟

今天做的需求是个模糊搜索功能

需要做一些数组操作,首先声明一个数组

serviceList:[

 { serviceName:"我有急事", url:"/pagesQunzhong/woyoujishi/index" }, 

 { serviceName:"投诉建议", url:"/pagesQunzhong/jianyitousu/index" }, 

 { serviceName:"扫码开门", url:"/pagesQunzhong/wode/scanningCode" },

 { serviceName:"社保查询", url:"/pagesQunzhong/shebaoInquire/index" },

 { serviceName:"医疗保险信息查询", url:"/pagesQunzhong/yibaosearch/index" }

]

组件使用的是uView里的u-search,通过@change事件,获取实时的input值,然后调接口,把返回值遍历在下面的list,然后点击跳转到相应的页面

不想使用很多的if else来做,然后看了下es6新特性,这个时候可以使用ES6的find方法,会遍历数组返回匹配的那条数据

例如serviceName = "我有急事";

let serviceItem = this.serviceList.find(function(itemSub){ 

    return serviceName == itemSub.serviceName;

})

返回serviceItem参数就是:

[{ serviceName:"我有急事", url:"/pagesQunzhong/woyoujishi/index" }]

我们需求是其中的“社保查询”和“医疗保险信息查询”需要实名认证,所以需要判断当前的值是不是这个两个,是的话提醒用户去实名,同样不想用if else现在虽然只有但是怕未来会增加,代码就又变得很长,

所以可以声明一个数组:

realNameList:["社保查询","医疗保险信息查询"]

让当前的serviceName去数组里遍历就行了,然后最近发现一个ES6新特性代替indexOf的方法:includes方法

我们可以这样写:

     let isRealName = this.realNameList.includes(serviceName) ;

然后isRealName会返回true或false用这个来做判断就行了,省去了大量if else