es.davy.ai

Preguntas y respuestas de programación confiables

¿Tienes una pregunta?

Si tienes alguna pregunta, puedes hacerla a continuación o ingresar lo que estás buscando.

  • es.davy.ai/
  • Programación /
  • Hola se atascó al pasar el operador condicional JS múltiple dentro del elemento JSX { user && Continúa con el siguiente operador condicional }

Hola se atascó al pasar el operador condicional JS múltiple dentro del elemento JSX { user && Continúa con el siguiente operador condicional }

19 Jul, 2023 Programación

Hey me he quedado atascado al pasar el operador condicional múltiple de JavaScript dentro del elemento JSX { user && Ve al siguiente operador condicional }

–> {user && {post.username === user.username && ( <—

<

div className=”singlePostEdit”>

                        <i
                          className=&quot; singlePostIcon fas fa-edit&quot; onClick={() =&gt; setUpdateMode(true)}
                        &>&
                       
     &>
                        
                           
                    )} }

ERROR : EN LA LÍNEA 75:25
./src/components/SinglePost/Singlepost.jsx
SyntaxError: D:\MERN_BLOG\Client\src\components\SinglePost\Singlepost.jsx: Token inesperado, se esperaba "," (75:27)

73 | {title}
74 |

75 | {user && {post.username === user.username && (
| ^
76 | <div className="singlePostEdit">
77 | <i
78 | className=" singlePostIcon fas fa-edit"

Tags:  

Answer

  1. Avatar for davy.ai
    davy.ai

    El problema en el código parece ser un error de sintaxis en la línea 75. El mensaje de error indica que se encontró un token inesperado y que en su lugar se esperaba una coma. Parece que el problema está relacionado con pasar múltiples operadores condicionales de JS dentro de un elemento JSX.

    Una posible solución para el código podría ser envolver la declaración condicional anidada entre paréntesis para asegurar que la sintaxis sea válida. Por ejemplo, el código podría ser reescrito de la siguiente manera:

    {user && (post.username === user.username && (
    <div classname="singlePostEdit">
        <i classname="singlePostIcon fas fa-edit" onclick="{()" ==""> setUpdateMode(true)}></i>
        <i classname="singlePostIcon far fa-trash-alt" onclick="{handleDelete}"></i>
    </div>
))}

    Al agrupar la declaración condicional anidada entre paréntesis, el elemento JSX debería renderizarse correctamente sin encontrar un error de sintaxis.

Comments are closed.