Answer the question
In order to leave comments, you need to log in
How to implement a text string before loading the main array?
I need it to show "Data is being loaded"
before loading an array of objects with user operation data,
at the moment, initially I store an empty array in the state variable, pass it to the component, from where I sort through the data, before I get all the data, I need text information, the array itself may end up empty, and I will need to display "You had no operations"
xport default function App() {
const [operationsLoan, setOperationsLoan] = useState([] );
useEffect(() => {
apiGetOperationsLoan()
.then((response) => {
setOperationsLoan(response.data);
});
}, []);
return (
<>
<div className="cabinet__history-title">
<h1>
История операций
</h1>
</div>
<TabBar>
<TabBarItem label="Операции по займам">
<div className="loans-history">
{
operationsLoan.map((loan, index) => {
return <Loan loan={loan} key={index}/>;
})
}
</div>
</TabBarItem>
</TabBar>
Answer the question
In order to leave comments, you need to log in
export default function App() {
const [operationsLoan, setOperationsLoan] = useState([] );
const [loading, setLoading] = useState(false);
useEffect(() => {
setLoading(true);
apiGetOperationsLoan()
.then((response) => {
setOperationsLoan(response.data);
setLoading(false);
});
}, []);
// можно еще так сделать, зависит от обстоятельств
// if (loading) {
// return <p> Идет загрузка данных </p>
// }
return (
<>
<div className="cabinet__history-title">
<h1>
История операций
</h1>
</div>
<TabBar>
<TabBarItem label="Операции по займам">
<div className="loans-history">
{loading ? <p>Идет загрузка данных</p>
: { operationsLoan.map((loan, index) => {
return <Loan loan={loan} key={index}/>;
})}
}
</div>
</TabBarItem>
</TabBar>
Didn't find what you were looking for?
Ask your questionAsk a Question
731 491 924 answers to any question