Vue.js简化es5的代码

Question

像这样的if判断代码在vue里面显得过于臃肿，该怎么优化if语句？methods: {  next() {    if (this.cateDatas.caijing != '') {      if(this.cateDatas.redian != '') {        if(this.cateDatas.hangye != '') {          if(this.cateDatas.youhui != '') {            if(this.cateDatas.diyu != '') {              this.id++;            } else {              alert("请选择地域信息！")            }          }  else {            alert("请选择优惠政策！")          }        }  else {          alert("请选择行业资讯！")        }      }  else {        alert("请选择热点聚焦！")      }    } else {      alert("请选择财经新闻！")    }  }}

Answer 1

//原始数据

const cateDatas = {

    caijing: '22',

    redian: ''

}

let id = 0;

//配置数据

const config = {

    caijing: '请输入财经新闻！',

    redian: '请输入热点聚焦！',

}

if (Object.keys(cateDatas).every(v => cateDatas[v] != '' ? true : alert(config[v]))) {

    id++;

}

Answer 2

定义一个数组将要判断的属性存储，然后forEach遍历数组判断