Вопрос пользователя:
// import React from 'react';
import { useSearchParams, Route, Link} from 'react-router-dom';
// import {useRef, useEffect} from 'react';
// // export const Title = ({children}: React.PropsWithChildren) => {
// // return <h4>{children}</h4>;
// // };
// export const Title = ({ children }) => { const titleRef = useRef(null);
// const [searchParams, setSearchParams] = useSearchParams();
// useEffect(() => {
// if (searchParams.currentTab === 'hotels' || searchParams.currentTab === 'countries') { titleRef.current.scrollIntoView({ behavior: 'smooth' }); }
// }, [searchParams.currentTab]);
// return <h4>{children}</h4>;
// };
import React, { useEffect, useRef } from 'react';
export const Title = ({ children }: React.PropsWithChildren) => { const titleRef = useRef<HTMLHeadingElement>(null); const [searchParams, setSearchParams] = useSearchParams();
useEffect(() => {
if (searchParams.currentTab === 'hotels' || searchParams.currentTab === 'countries') { titleRef.current.scrollIntoView({ behavior: 'smooth' }); }
}, [searchParams.currentTab]);
return <h4 ref={titleRef}>{children}</h4>;
};
Ответ нейросети:
Пройдите быструю авторизацию для просмотра: Войти через Google
Войти через Яндекс
Войти через VK
In the updated code, I have made the following changes:
Changed the import statement for React to import both React and other necessary functions from 'react'.
Updated the Title component to use useRef and useEffect hooks from 'react'.
Added a ref attribute to the <h4> element to scroll into view when the currentTab is 'hotels' or 'countries'.
These changes will allow the Title component to scroll into view when the specified conditions are met.