Me gustaría detener el bucle dentro bedsAssign.map si row.id no es igual a u.tenant_id pero pone break; no funciona
{tenants.map((row) => bedsAssign.map( (u) => row.id !== u.tenant_id && ( <MenuItem key={row.id} value={row.id}> {row.fullName} </MenuItem> break; --> not working ) ) )}Puede agregar un filter antes del map para eliminar todos los elementos bedsAssign que no coincidan con la row.id
{ tenants.map((row) => bedsAssign .filter((u) => row.id !== u.tenant_id) .map((u) => ( <MenuItem key={row.id} value={row.id}> {row.fullName} </MenuItem> )) ) } Si desea romper el ciclo, puede intentar usar some o find con un return adecuado para el map
{ tenants.map((row) => { const isAssigned = bedsAssign.some((u) => row.id !== u.tenant_id) return isAssigned ? (<MenuItem key={row.id} value={row.id}> {row.fullName} </MenuItem>) : null }) }No puede romper ningún método de matriz como forEach, filter, map, etc. Si se encuentra con un escenario en el que desea que su bucle se rompa, entonces debe usar el bucle for tradicional.
use un filter en lugar de un map para camasAsignar:
{tenants.map((row) => bedsAssign.filter( (u) => row.id !== u.tenant_id && ( <MenuItem key={row.id} value={row.id}> {row.fullName} </MenuItem> ) ) )}el filtro solo completará los elementos que cumplan con la condición que desea.
EDITAR: Me di cuenta de que desea interrumpir una vez que se cumple la condición, esto funcionaría en este caso:
{tenants.map((row) => for(let i of bedsAssign){ if(row.id !== i.tenant_id && ( <MenuItem key={row.id} value={row.id}> {row.fullName} </MenuItem> )){ break } } ) )}