import React, useState from 'react'; import View, Text, Button, TextInput from 'react-native'; export default function UserInput() const [name, setName] = useState(''); const [submitted, setSubmitted] = useState(false);
export default function AutoFocusInput() const inputRef = useRef(null); const intervalRef = useRef(null); const [timer, setTimer] = useState(0); useEffect(() => inputRef.current?.focus(); // Focus on mount
return () => clearInterval(intervalRef.current); , []);
fetchData();
intervalRef.current = setInterval(() => setTimer(t => t + 1); , 1000);
Goal: Memoize functions and values to prevent unnecessary re-renders.
The Complete React Native Hooks Course [ 2024 ]
import React, useState from 'react'; import View, Text, Button, TextInput from 'react-native'; export default function UserInput() const [name, setName] = useState(''); const [submitted, setSubmitted] = useState(false);
export default function AutoFocusInput() const inputRef = useRef(null); const intervalRef = useRef(null); const [timer, setTimer] = useState(0); useEffect(() => inputRef.current?.focus(); // Focus on mount
return () => clearInterval(intervalRef.current); , []);
fetchData();
intervalRef.current = setInterval(() => setTimer(t => t + 1); , 1000);
Goal: Memoize functions and values to prevent unnecessary re-renders.