Вопросы с тегом «react-hooks»

Позвольте мне объяснить результат этого кода, чтобы легко задать мою проблему. 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 handleName …

94 reactjs  react-hooks 

Я переношу проект React с TypeScript для использования функций перехватчиков (React v16.7.0-alpha), но я не могу понять, как установить типизацию деструктурированных элементов. Вот пример: interface IUser { name: string; } ... const [user, setUser] = useState({name: 'Jon'}); Я хочу, чтобы userпеременная была типа IUser. Мое единственное успешное испытание состоит из …

89 reactjs  typescript  react-hooks 

Стандартный способ использования React useState Hook заключается в следующем: const [count, setCount] = useState(0); Однако эта const countпеременная явно будет переназначена на другое примитивное значение. Почему тогда переменная не определена как let count?

33 javascript  reactjs  ecmascript-6  react-hooks 

Вот проблема: я пытаюсь вызвать 2 функции одним нажатием кнопки. Обе функции обновляют состояние (я использую хук useState). Первая функция корректно обновляет значение 1 до «нового 1», но через 1 с (setTimeout) запускается вторая функция, и она меняет значение 2 до «нового 2», НО! Он устанавливает значение 1 обратно в …

31 javascript  reactjs  react-hooks 

Я пытаюсь понять, как использовать прослушиватель Firebase, чтобы данные облачного хранилища обновлялись с помощью обновлений активных перехватчиков. Первоначально я сделал это, используя компонент класса с функцией componentDidMount, чтобы получить данные о пожарном депо. this.props.firebase.db .collection('users') // .doc(this.props.firebase.db.collection('users').doc(this.props.firebase.authUser.uid)) .doc(this.props.firebase.db.collection('users').doc(this.props.authUser.uid)) .get() .then(doc => { this.setState({ name: doc.data().name }); // loading: false, }); …

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

Я использую новый крючок useHistory от React Router, который вышел несколько недель назад. Моя версия React-роутера 5.1.2. Мой Реакт находится на версии 16.10.1. Вы можете найти мой код внизу. Тем не менее, когда я импортирую новую историю использования из реагирующего маршрутизатора, я получаю эту ошибку: Uncaught TypeError: Cannot read property …

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

React Hooks дают нам опцию useState, и я всегда вижу сравнения Hooks и Class-State. Но как насчет хуков и некоторых обычных переменных? Например, function Foo() { let a = 0; a = 1; return <div>{a}</div>; } Я не использовал крючки, и это даст мне те же результаты, что и: function …

12 javascript  node.js  reactjs  react-hooks 

Я делаю кастомный хук, который имеет переключатель при изменении состояния. Вы должны быть в состоянии передать любое состояние в массиве. import { useState, useEffect } from 'react' const useFlatListUpdate = (dependencies = []) => { const [toggle, setToggle] = useState(false) useEffect(() => { setToggle(t => !t) }, [...dependencies]) return toggle …

10 reactjs  react-native  eslint  react-hooks 

когда в среде разработки, мое приложение работает просто отлично. В производственной среде происходит сбой с ошибкой: Uncaught TypeError: (0 , _react.useEffect) is not a function Это происходит в файле, который я создал, куда я импортирую React и используюEffect следующим образом: import React, { useEffect } from 'react' const X = …

9 javascript  reactjs  react-hooks  parceljs 

Я бы хотел, чтобы пользователь мог сортировать список элементов задач. Когда пользователь выбирает элемент из выпадающего списка, он устанавливает, sortKeyкоторый создаст новую версию setSortedTodos, и, в свою очередь, вызывает useEffectвызов и setSortedTodos. Приведенный ниже пример работает именно так, как я хочу, однако eslint побуждает меня добавить todosк useEffectмассиву зависимостей, и …

9 javascript  reactjs  react-hooks  eslint