Tengo un componente de plantilla que necesita agregar un elemento secundario a un nodo ranurado. Actualmente lo hago así:
const x = document.createElemet('x'); slotted.appendChild(x);Pero quiero hacer algo como esto:
const xJsx = (<x></x>); slotted.appendChild(xJsx); Este último no funcionará porque appendChild espera un Nodo, HTMLElement o DocumentFragement, pero ¿hay alguna forma de convertir el JSX y agregarlo en tiempo de ejecución usando la plantilla?
Generalmente no, no puedes
Elaborar:
JSX es solo una sintaxis, solo existe cuando está en un editor escribiendo código, lo ayuda a escribir este lenguaje específico que es fácil de entender para los humanos y luego se puede traducir a etiquetas javascript y html.
Cuando dice tiempo de ejecución, se refiere al tiempo de ejecución de javascript del navegador, el motor JS del navegador no sabe qué es JSX. Como resultado, no funciona.
Ahora, esto es lo que babel viene al juego: traduce su código de sintaxis JSX a javascript compatible con el navegador. Y sucede en tiempo de construcción. (lo preconstruyes)
La razón por la que dije "generalmente" es que nadie impide que una persona intente usar babel para transpilar JSX en el navegador con algún truco... sin embargo, personalmente no lo recomendaría ya que es muy ineficiente y necesita mucho trabajo para tenerlo. laboral