resueltos - validacion de formularios con javascript ejemplos

Advertencia: isMounted(…) está en desuso en las clases de JavaScript simples

Question

Estoy implementando 2 pantallas usando react-navigation. Pero recibí la siguiente advertencia mientras navegaba a la segunda página:

Advertencia: isMounted (...) está en desuso en las clases de JavaScript simples. En su lugar, asegúrese de limpiar las suscripciones y solicitudes pendientes en componentWillUnmount para evitar pérdidas de memoria.

Versiones:

• reaccionar: 16.3.1
• reactivo-nativo: 0.55.2
• reacción de navegación: 1.5.11
• util: 0.10.3

Login.js

import React, { Component } from ''react'';
import { Text, View, Image, TextInput, TouchableOpacity } from ''react-native'';
import styles from "./styles";
export default class Login extends Component {
constructor(props) {
super(props);
}
render() {
const { navigate } = this.props.navigation;
return (
<View style={styles.container}>
<View style={styles.formContainer}>
<TouchableOpacity style={styles.button} onPress={()=> navigate(''Home'')} >
<Text style={styles.buttonText}>LOGIN</Text>
</TouchableOpacity>
</View>
</View>
)
}

Inicio.js

import React, { Component } from ''react'';
import { Text, View } from ''react-native'';
import styles from "./styles";
export default class Home extends Component {
constructor(props) {
super(props);
}
render() {
const { navigate } = this.props.navigation;
return(
<View style={styles.container}>
<Text>Home Screen</Text>
</View>
)
}
}

¿Que me estoy perdiendo aqui?

Answer 1

El problema de react-navegación está cerrado, puedes verlo github.com/react-navigation/react-navigation/issues/3956

Ellos están declarando que es un problema en algún lugar dentro de reaccion-nativo

Answer 2

Es en realidad un problema React-Native

Puede esperar y verificar cuándo hay una solución disponible aquí: github.com/facebook/react-native/issues/18868

O mientras tanto, puede ocultar la advertencia como se sugiere.

Answer 3

Este es un problema con la última versión de React Navigation y React Native. Para silenciarla agregue:

import { YellowBox } from ''react-native'';
YellowBox.ignoreWarnings([''Warning: isMounted(...) is deprecated'', ''Module RCTImageLoader'']);

Espero que se solucione en React Navigation en las próximas semanas.

Answer 4

Esto es lo que hice para este problema por el momento:

paso 1: toque en la advertencia

paso 2: en la ventana amarilla, haz clic en la opción de seguimiento de pila en la parte superior derecha

paso 3: busque la ruta donde ocurrió la advertencia, por ejemplo: C: / Users / username / projectname / node_modules / react / cjs / react.development.js

paso 4: abrir la ruta en el editor

Paso 5: Encuentre la palabra clave que se encuentra debajo de las API en desuso y elimine la función obsoleta y la advertencia relacionada con ella.

Paso 6: ¡Guarda y vuelve a cargar tu aplicación!

Answer 5

Esto no es de react-navigation ya que miré en node_modules y react-navigation no usa isMounted , viene de algún lugar dentro de React-Native, también he hecho el mismo pirateo utilizado por @Romsun

 import { YellowBox } from ''react-native'';
YellowBox.ignoreWarnings([''Warning: isMounted(...) is deprecated'', ''Module RCTImageLoader'']);

Answer 6

Ignorar este mensaje es el camino equivocado para un buen desarrollador. Si eliminamos este problema, la pérdida de memoria disminuye.

Answer 7

La siguiente solución funciona para mí:

import { YellowBox } from ''react-native'';
YellowBox.ignoreWarnings([''Warning: isMounted(...) is deprecated'', ''Module RCTImageLoader'']);

Answer 8

Las respuestas anteriores no funcionaron para mí, pero agregar lo siguiente a index.js hizo el truco:

console.ignoreYellowBox = [''Warning: isMounted(...) is deprecated''];

O actualice a la expo 27.0.2 que básicamente agrega lo anterior a Expo.js Ver más información aquí: https://forums.expo.io/t/warnings-after-upgrade-to-expo-27/9579/10

Como indicaron algunas de las otras respuestas, es un problema de react-native , así que espero que se solucione pronto allí y luego en la siguiente versión de Expo.

Answer 9

Si está utilizando EXPO para el desarrollo de RN, este problema se solucionó en la expo 27.0.2.

Consulte https://forums.expo.io/t/warnings-after-upgrade-to-expo-27/9579/12

Answer 10

Si está utilizando un cliente de expo, actualice su versión a [email protected] que corrige esta advertencia. . .

Answer 11

Utilice esta declaración en index.js :

import { YellowBox } from ''react-native'';
YellowBox.ignoreWarnings([''Warning: isMounted(...) is deprecated'', ''Module RCTImageLoader'']);