5

Este código en Reactjs es transpilado por babeljs, quiero saber si se puede comentar el código HTML en esta función.

var SearchBar = React.createClass({
    render : function () {
        return (
            <form>
                <input type='text' placeholder='Search...' className='form-control'/>
                <p>
                    <input type='checkbox' className='form-control'/>
                    {' '}
                    Only show products in stock
                </p>                
            </form>
        )
    }
})

Nota : No funciona el /* */ - //

1
  • Debido a que React pasa por un proceso de transpilación de JSX a JS y HTML, los comentarios en HTML son completamente ignorados, y debido al poder de la sintaxis, usted no puede dejar comentarios en él. Commented el 16 jun. 2020 a las 3:21

4 respuestas 4

4

Para comentar código en React JSX , una línea simplemente usa: //

var a = React.DOM.p(null,
        "Mi primer línea",
//      "Segunda linea comentada"
        "tercer línea"
);

o un bloque completo entre los contenedores {/* y */}:

 return (
  <div>
      {/* <form>
            <input type='text' placeholder='Search...' className='form-control'/>
            <p>
      </p>                
        </form>*/}
  </div>
);
4
  • con react no funciona asi Commented el 9 mar. 2016 a las 16:53
  • agrega los brackets: {/* y */} recuerda que los brackets son necesarios cuando estas dentro de un tag html como en el ejemplo que te muestro.
    – Jorgesys
    Commented el 9 mar. 2016 a las 17:02
  • eso funciona para comentar javascript, pero no HTML Commented el 9 mar. 2016 a las 18:30
  • 1
    En la doc oficial (facebook.github.io/react/docs/jsx-in-depth.html#comments) nos sugiere la manera en la cual @Elenasys describe. Si no te esta funcionando debe ser por algo más. Commented el 24 jun. 2016 a las 4:44
3

Haz esto:

{/* Esto es un comentario */}

Aquí está un ejemplo en codepen

Con información de este sitio

7
  • con react no funciona asi Commented el 9 mar. 2016 a las 16:53
  • Daniel, no funciona dentro del código de tu método?
    – Jorgesys
    Commented el 9 mar. 2016 a las 16:54
  • asi es @Elenasys Commented el 9 mar. 2016 a las 16:56
  • @DanielHernández así se comenta, te dejé un ejemplo, trata de comentar como te hemos dicho y verás que sí :)
    – x4mp73r
    Commented el 9 mar. 2016 a las 17:06
  • quiero comentar el HTML , no el javascript Commented el 9 mar. 2016 a las 18:32
0

Dependiendo de la sección donde quieras comentar, si quieres comentar en el render tiene que utilizar: {/* Aquí lo que quieres comentar */ }. Si quieres comentar una linea en una función simplemente utilizar las formas conocidas //Para una sola linea o

/* Para varias lineas*/

Espero te sirva mi respuesta.

0
 {/* <form>
 <input type='text' placeholder='Search...' className='form-control'/>
<p>
<input type='checkbox' className='form-control'/>
{' '}
Only show products in stock
                </p>                
</form>*/}

puedes usar esto con el atajo de control + } (en window es)

1
  • 1
    Tu respuesta podría mejorarse con información de apoyo adicional. Por favor, pulsa en editar para añadir más detalles, como citas o documentación, para que otros puedan confirmar que tu respuesta es correcta. Puedes encontrar más información sobre cómo escribir buenas respuestas en el centro de ayuda.
    – Comunidad Bot
    Commented el 7 feb. 2023 a las 3:07

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.