Saltar al contenido principal
Versión: 0.80

Manipulación Directa

Traducción Beta No Oficial

Esta página fue traducida por PageTurner AI (beta). No está respaldada oficialmente por el proyecto. ¿Encontraste un error? Reportar problema →

A veces es necesario modificar directamente un componente sin usar estado/props para activar un re-renderizado de todo el subárbol. Por ejemplo, al usar React en el navegador, ocasionalmente necesitas modificar directamente un nodo DOM, y lo mismo aplica para vistas en aplicaciones móviles. setNativeProps es el equivalente en React Native a establecer propiedades directamente en un nodo DOM.

precaución

¡Usa setNativeProps cuando los re-renderizados frecuentes creen cuellos de botella de rendimiento!

La manipulación directa no será una herramienta que uses frecuentemente. Normalmente solo la emplearás para crear animaciones continuas y evitar la sobrecarga de renderizar la jerarquía de componentes y reconciliar múltiples vistas. setNativeProps es imperativo y almacena estado en la capa nativa (DOM, UIView, etc.), no dentro de tus componentes React, lo que dificulta razonar sobre tu código.

Antes de usarlo, intenta resolver tu problema con setState y shouldComponentUpdate.

Usar setNativeProps para editar el valor de TextInput

Otro caso de uso muy común de setNativeProps es editar el valor del TextInput. La propiedad controlled de TextInput a veces puede perder caracteres cuando el bufferDelay es bajo y el usuario escribe muy rápido. Algunos desarrolladores prefieren omitir esta propiedad por completo y en su lugar usar setNativeProps para manipular directamente el valor de TextInput cuando sea necesario.

Por ejemplo, el siguiente código demuestra cómo editar la entrada al presionar un botón:

Puedes usar el método clear para limpiar el TextInput, que borra el texto actual usando el mismo enfoque.

Evitar conflictos con la función de renderizado

Si actualizas una propiedad que también es gestionada por la función de renderizado, podrías encontrar errores impredecibles porque cada vez que el componente se vuelva a renderizar y esa propiedad cambie, cualquier valor establecido previamente con setNativeProps será ignorado y sobrescrito.