[英]How to fix this ESlint (no-param-reassign) error in my Filter
我正在尝试仅查找具有特定服务的用户。 每个用户都有一系列服务。 我需要找到的匹配项如下:
userService.name === service.name && !user.disabled
下面的代码有效,但是在处理参数重新分配时出现ESlint错误。
export const matchUserWithService = (user, userService, service) => {
if (userService.name === service.name && !user.disabled) {
user.isMatched = true;
userService.rights = service.rights;
}
return userService;
};
export const renderServiceAdmins = (users, selectedService) => {
const usersWithService = users.filter((user) => {
user.services.map(usrSrv => matchUserWithService(user, usrSrv, selectedService));
if (user.isMatched) return user;
return false;
});
return usersWithService.map(user => user.services.map(service => service.rights.map((right) => {
if (
service.name === selectedService.name &&
lowCase(right.name) === 'admin' &&
!right.disabled
) {
return (
<li key={user.email + randId()}>
{ user.name } | <span className="info_blue">{ user.email }</span>
</li>
);
}
return null;
})));
};
可以使用.find
重构.find
吗?
我建议重新组织代码,因为现在它依赖于.map
调用中的突变,这可能很难推理。 我无法检查我建议的代码是否确实有效,但是我认为它表达了您尝试做的事情的意图。
编辑 。 说明:简而言之,我们有一个用户列表,其中只有一些是相关的。 这告诉我们,我们可能希望代码以users.filter
。 通常的想法是过滤出具有所选服务管理员权限的用户。 因此,我试图将该逻辑提取到一个函数( userHasAdminRightsForService
)中,该函数实现为一个函数,该函数返回将要用于过滤用户的函数。 由于这种设计,我们得到的代码读起来更像普通英语: users.filter(userHasAdminRightsForService(selectedService))
而不是users.filter(user => userHasAdminRightsForService(user, selectedService))
。
Array.prototype.some
用于检查数组是否具有至少一个满足某些条件的元素。 因此,像userService.rights.some(right => lowCase(right.name) === 'admin')
表示我们检查userService.rights
中的至少一项权利是否满足其应具有名称的条件“管理员”。
// given a serviceToCheckFor, return a function that checks if
// one specific user has any userService, with admin rights, that match the name of serviceToCheckFor
export const userHasAdminRightsForService = serviceToCheckFor = user => {
return user.services.some(userService =>
// name check
userService.name === serviceToCheckFor.name &&
// check if there exists a non-disabled admin right
userService.rights
.filter(right => !right.disabled)
.some(right => lowCase(right.name) === 'admin')
);
};
export const renderServiceAdmins = (users, selectedService) => {
const adminsForSelectedService = users
.filter(user => !user.disabled)
.filter(userHasAdminRightsForService(selectedService))
return adminsForSelectedService.map( admin =>
(<li key={admin.email + randId()}>
{ admin.name } | <span className="info_blue">{ admin.email }</span>
</li>)
);
};
也许您可以在不禁用规则的情况下进行重写?
export const renderServiceAdmins = (users, selectedService) => {
var admins = users.reduce((serviceAdmins, user) => {
user.services
.forEach((service) =>{
if(service.name === selectedService.name) {
service.rights
.forEach((right)=> {
if( lowCase(right.name) === 'admin' && !right.disabled) {
serviceAdmins.concat[{
name: user.name,
name: user.email
}]
}
})
}
});
return serviceAdmins;
}, []);
return admins.map(admin=> {
return (
<li key={admin.email + randId()}>
{ admin.name } | <span className="info_blue">{ admin.email }</span>
</li>
);
});
};
我们最终以这种方式解决了问题,它更加简洁,代码也更少(删除了2个功能)! 缺少的部分是链接过滤器,然后使用.find
export const renderServiceAdmins = (users, theService) =>
users
.filter(user => !user.disabled)
.filter(user => user.services.find(
usrSrv => (
usrSrv.name === theService.name &&
usrSrv.rights.find(r => r.name.toLowerCase() === 'admin' && !r.disabled)
)
))
.map(user => (
<li key={user.email + randId()}>
{ user.name } | <span className="info_blue">{ user.email }</span>
</li>
));
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.