Preguntas etiquetadas con react-hooks

¿Hay formas de simular componentDidMounten React componentes funcionales a través de ganchos?

99 javascript  reactjs  react-hooks 

Espero que el estado se recargue en el cambio de accesorios, pero esto no funciona y la uservariable no se actualiza en la próxima useStatellamada, ¿qué está mal? function Avatar(props) { const [user, setUser] = React.useState({...props.user}); return user.avatar ? (<img src={user.avatar}/>) : (<p>Loading...</p>); } codepen

95 reactjs  react-hooks 

Según los documentos: componentDidUpdate()se invoca inmediatamente después de que se realiza la actualización. Este método no se llama para el renderizado inicial. Podemos usar el nuevo useEffect()gancho para simular componentDidUpdate(), pero parece que useEffect()se ejecuta después de cada renderizado, incluso la primera vez. ¿Cómo hago para que no se ejecute …

95 javascript  reactjs  react-hooks 

Estoy migrando un proyecto de React con TypeScript para usar funciones de hooks (React v16.7.0-alpha), pero no puedo averiguar cómo configurar los tipos de los elementos desestructurados. Aquí hay un ejemplo: interface IUser { name: string; } ... const [user, setUser] = useState({name: 'Jon'}); Quiero forzar que la uservariable sea …

88 reactjs  typescript  react-hooks 

Permítanme explicar el resultado de este código para preguntar mi problema fácilmente. const ForExample = () => { const [name, setName] = useState(''); const [username, setUsername] = useState(''); useEffect(() => { console.log('effect'); console.log({ name, username }); return () => { console.log('cleaned up'); console.log({ name, username }); }; }, [username]); const …

83 reactjs  react-hooks 

La forma estándar de usar un React useState Hook es la siguiente: const [count, setCount] = useState(0); Sin embargo, esta const countvariable claramente se reasignará a un valor primitivo diferente. ¿Por qué entonces la variable no se define como let count?

33 javascript  reactjs  ecmascript-6  react-hooks 

Aquí está el problema: estoy tratando de llamar a 2 funciones con un clic de botón. Ambas funciones actualizan el estado (estoy usando el enlace useState). La primera función actualiza el valor1 correctamente a 'nuevo 1', pero después de 1s (setTimeout) se dispara la segunda función, y cambia el valor …

31 javascript  reactjs  react-hooks 

Estoy tratando de descubrir cómo usar un escucha de Firebase para que los datos del almacén de incendios en la nube se actualicen con actualizaciones de ganchos de reacción. Inicialmente, hice esto usando un componente de clase con una función componentDidMount para obtener los datos del almacén de incendios. this.props.firebase.db …

27 javascript  reactjs  firebase  google-cloud-firestore  react-hooks 

Estoy usando el nuevo gancho useHistory de React Router, que salió hace unas semanas. Mi versión del router React es 5.1.2. My React está en la versión 16.10.1. Puedes encontrar mi código en la parte inferior. Sin embargo, cuando importo el nuevo useHistory desde react-router, me sale este error: Uncaught …

18 reactjs  react-router  react-hooks  react-router-dom  react-context 

React Hooks nos da la opción useState, y siempre veo las comparaciones Hooks vs Class-State. Pero, ¿qué pasa con los ganchos y algunas variables regulares? Por ejemplo, function Foo() { let a = 0; a = 1; return <div>{a}</div>; } No utilicé Hooks, y me dará los mismos resultados que: …

12 javascript  node.js  reactjs  react-hooks 

Estoy haciendo un gancho personalizado que tiene un toogle cuando algún estado cambia. Debería poder pasar cualquier estado en una matriz. import { useState, useEffect } from 'react' const useFlatListUpdate = (dependencies = []) => { const [toggle, setToggle] = useState(false) useEffect(() => { setToggle(t => !t) }, [...dependencies]) return …

10 reactjs  react-native  eslint  react-hooks 

cuando en el entorno de desarrollo, mi aplicación funciona bien. Cuando en el entorno de producción se bloquea con el error: Uncaught TypeError: (0 , _react.useEffect) is not a function Sucede en un archivo que creé donde importo React y useEffect de esta manera: import React, { useEffect } from …

9 javascript  reactjs  react-hooks  parceljs 

Me gustaría que el usuario pueda ordenar una lista de elementos pendientes. Cuando los usuarios seleccionan un elemento de un menú desplegable, establecerán el sortKeyque creará una nueva versión setSortedTodosy, a su vez, activará useEffecty llamará setSortedTodos. El siguiente ejemplo funciona exactamente como quiero, sin embargo, eslint me está pidiendo …

9 javascript  reactjs  react-hooks  eslint