Сбросить кнопку фильтров только обновления пользовательского интерфейса после второго нажатия [Duplicate] ⇐ Javascript

[Anonymous]

У меня есть кнопки применить фильтры и сбросить фильтры . Когда я нажимаю применить фильтры , он применяет фильтры в пользовательском интерфейсе, но когда я нажимаю сбросить фильтры , его нажимают только после того, как его нажимают два раза. Вот код: < /p>
import { useState, useEffect } from 'react';
import { getBusinesses } from '../api/DBRequests';
import categories from '../constants/categories';

const BusinessListPage = () => {
const [businesses, setBusinesses] = useState([]);
const [filters, setFilters] = useState({
category: '',
state: '',
minPrice: '',
maxPrice: '',
minRevenue: '',
maxRevenue: '',
});
const [sortBy, setSortBy] = useState('');
const [loading, setLoading] = useState(false);

useEffect(() => {
fetchBusinesses();
}, []);

const fetchBusinesses = async () => {
setLoading(true);
try {
const adjustedSortBy =
sortBy === 'asc' ? 'asc' : sortBy === 'desc' ? 'desc' : '';
const businesses = await getBusinesses(adjustedSortBy, filters);
setBusinesses(businesses);
} catch (error) {
console.error('Error fetching businesses:', error.message);
} finally {
setLoading(false);
}
};

const handleInputChange = (e) => {
const { name, value } = e.target;
setFilters((prevFilters) => ({ ...prevFilters, [name]: value }));
};

const handleResetFilters = () => {
setFilters({
category: '',
state: '',
minPrice: '',
maxPrice: '',
minRevenue: '',
maxRevenue: '',
});
setSortBy('');
fetchBusinesses();
};

return (




Filters


Category


All Categories
{categories.map((category, index) => (

{category}

))}



Apply Filters


Reset Filters




{/* Businesses List Section */}

{loading && Loading
}

{businesses.length === 0 && !loading && (

No businesses found.

)}
{businesses.map((business) => (



{business.name}


View Details




))}




);
};

export default BusinessListPage;


Подробнее здесь: https://stackoverflow.com/questions/793 ... cond-click