Business
Jobs
  • About Us
  • Solutions
    • Job Postings
      Post your job and receive qualified candidates in 48h.
    • Candidate Assessments
      500+ technical and psychological tests, plus anti-fraud.
    • Headhunting
      Tailor-made executive search from start to finish.
    • Payroll + EOR
      Payroll dispersal and EOR across 15+ LATAM countries.
  • Pricing
  • Jobs

0

159
Views
La lista renderizada condicionalmente en React se comporta con un método, pero no con otro

Tengo una lista de productos para renderizar. También tengo una serie de palabras clave que se utilizan para excluir productos de la representación.

Estoy recorriendo la matriz de palabras clave y comprobando si el título del producto contiene alguna de las entradas. Luego devuelve un valor booleano.

El siguiente código no funciona. El archivo console.log funciona y refleja el resultado, pero no se procesa nada.

 function inExcludes(product, excludedItems) { excludedItems.forEach( item => { if (product.includes(item)) { console.log(true); return true; } else { console.log(false); return false; } }) }
 export function CardsFiltered(props) { const cards = props.items.map((product) => { if (inExcludes(product.title, props.excludedItems) === false) return ( <CardValidation key={product.id} id={product.id} product={product} /> ) }) return ( <> {cards} </> ); }

Pero si configuro una variable como booleana, cambio esa variable si la condición es verdadera y luego devuelvo esa variable, funciona y mis tarjetas se procesan (código a continuación).

¿Alguien puede arrojar luz sobre esto? Porque no puedo resolverlo.

 function inExcludes(product, excludedItems) { let result = false; excludedItems.forEach( item => { if (product.includes(item)) { result = true; } }) return result; }
 export function CardsFiltered(props) { const cards = props.items.map((product) => { if (!inExcludes(product.title, props.excludedItems)) return ( <CardValidation key={product.id} id={product.id} product={product} /> ) }) return ( <> {cards} </> ); }
about 4 years ago · Juan Pablo Isaza
1 answers
Answer question

0

Su primera implementación de 'inExcludes' no devuelve un valor booleano (verdadero/falso). Simplemente está ejecutando 'forEach' en cada elemento de la matriz de elementos excluidos. El retorno dentro de ese ciclo no regresa de la función como un todo.

Entonces, como efectivamente devuelve 'indefinido', su renderizado decide no renderizar nada.

Aquí hay algo que hace lo que buscas (simplificado un poco):

https://codesandbox.io/s/awesome-mcclintock-hkkhsi?file=/src/App.js

about 4 years ago · Juan Pablo Isaza Report
Answer question
Find remote jobs

Discover the new way to find a job!

Top jobs
Top job categories
Business
Post vacancy Pricing Sales
Legal
Terms and conditions Privacy policy
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Show me some job opportunities
There's an error!