如何解决有没有办法避免嵌套的 switch 语句
我正在开发一个 React 项目,使用嵌套的 switch 语句根据用户的选择来路由用户。第一种情况还有两个嵌套的 switch 语句。第二种情况有一个嵌套的 switch 语句。在没有所有嵌套的 switch 语句的情况下,还有另一种方法可以做到这一点吗?非常感谢任何帮助。
clickConfirm = () => {
switch (this.props.serviceType) {
case 'car_service':
switch (this.props.loadType) {
case 0:
switch (this.props.photoMode) {
case 0:
this.props.push('/payment/');
break;
case 1:
this.props.push('/payment/');
// capture image here
break;
case 2:
this.props.push('/capture/');
break;
}
break;
case 1:
switch (this.props.photoMode) {
case 0:
this.props.history.push('/address/');
this.props.setToPhoneNumber(false);
break;
case 1:
this.props.history.push('/address/');
this.props.setToPhoneNumber(false);
// capture image here
break;
case 2:
this.props.push('/capture/');
break;
}
break;
case 2:
this.props.history.push('/phone/');
this.props.setToPhoneNumber(true);
break;
}
break;
case 'phone_service':
switch (this.props.photoMode) {
case 0:
this.props.history.push('/address/');
break;
case 1:
this.props.history.push('/address/');
// capture image here
break;
case 2:
this.props.history.push('/capture/');
break;
}
break;
}
};
解决方法
您可以将数据存储在这样的对象中:
const SERVICES = {
'car_service': {
0: {
0: ()=> {
this.props.push('/payment/');
}
}
}
}
然后您可以将 switch
部分替换为:
clickConfirm = () => {
SERVICES[this.props.serviceType][this.props.loadType][this.props.photoMode]();
}
,
我不建议这样做,似乎您的组件应该直接接受该选项,或者以其他方式分解而不是按原样组合。
但不知道您的用例或您为什么“推到道具”(?),纯粹是为了“扁平化”您的条件,您可以组合各种值并枚举已知组合。
注意:我尚未对此进行测试或尝试将其准确映射到您的条件,但总体思路...
const combined = [this.props.serviceType,this.props.photoMode,this.props.loadType || 'NA'].join('|');
switch (combined) {
case 'car_service|0|0':
this.props.push('/payment/'); break;
case 'car_service|1|0':
this.props.push('/payment/'); break; // capture image here
case 'car_service|2|0':
this.props.push('/capture/'); break;
case 'car_service|0|1':
this.props.push('/address/'); this.props.setToPhoneNumber(false); break;
case 'car_service|1|1':
this.props.push('/address/'); this.props.setToPhoneNumber(false); break; // capture image here
case 'car_service|2|1':
this.props.push('/capture/'); break;
case 'car_service|0|2':
case 'car_service|1|2':
case 'car_service|2|2':
this.props.history.push('/phone/'); this.props.setToPhoneNumber(true); break;
case 'phone_service|0|NA':
this.props.history.push('/address/'); break;
case 'phone_service|1|NA':
this.props.history.push('/address/'); break; // capture image here
case 'phone_service|2|NA':
this.props.history.push('/address/'); break;
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。