Quisiera saber como puedo cambiar un tag de html de por ejemplo un
<th></th>
a un
<td></td>
por medio de los props del componente
1 respuesta
La forma de cambiar de elementos en react suele hacerse a través de condiciones. Te dejo un link interesante que habla extensamente de varias posibilidades. https://www.robinwieruch.de/conditional-rendering-react#nested-conditional-rendering-in-react
Tambien te voy a poner un ejemplo en base a los elementos que propones en la pregunta.
Supongamos que tenemos el componente <Tabla />
que recibe una prop, tipoFila
.
<Tabla tipoFila='tr' />
El componente tabla tendrá dentro del método render
, donde corresponda mostrar un tipo u otro algo parecido a lo siguiente:
....
render() {
return (
<table>
{this.props.tipoFila === 'tr' (
? <tr>....</tr>
: <td>....</td>
)}
</table>
)
}
cloneElement
:React.cloneElement(this.props.tag, { children, <otras props> })
Y lo usas así:<MyComponent tag={<td />}>...</MyComponent>
.