/
spirzen
/
it-code-examples
Обзор
Документация
Войти
/
spirzen
/
it-code-examples
Код
Запросы
0
Задачи
Вики
Пакеты
0
Релизы
0
Аналитика
Безопасность
master
examples/javascript/code-412-11311-005/main.jsx
60 строк
2 KB
Spirzen
Code migration pack
09 июн 2026, 01:41
09 июн 2026, 01:41
cebc284
Код
Авторство
О чём код?
import { useEffect, useState } from 'react'; import { ActivityIndicator, FlatList, StyleSheet, Text, View } from 'react-native'; export default function PostsScreen() { const [posts, setPosts] = useState([]); const [loading, setLoading] = useState(true); const [error, setError] = useState(null); useEffect(() => { let cancelled = false; (async () => { try { const res = await fetch('https://jsonplaceholder.typicode.com/posts?_limit=10'); if (!res.ok) throw new Error(`HTTP ${res.status}`); const data = await res.json(); if (!cancelled) setPosts(data); } catch (e) { if (!cancelled) setError(e.message); } finally { if (!cancelled) setLoading(false); } })(); return () => { cancelled = true; }; }, []); if (loading) { return ( <View style={styles.center}> <ActivityIndicator size="large" /> </View> ); } if (error) { return ( <View style={styles.center}> <Text>Ошибка: {error}</Text> </View> ); } return ( <FlatList style={styles.list} data={posts} keyExtractor={(item) => String(item.id)} renderItem={({ item }) => ( <View style={styles.row}> <Text style={styles.title}>{item.title}</Text> </View> )} /> ); } const styles = StyleSheet.create({ center: { flex: 1, justifyContent: 'center', alignItems: 'center' }, list: { flex: 1, paddingTop: 48 }, row: { padding: 16, borderBottomWidth: 1, borderBottomColor: '#e5e7eb' }, title: { fontSize: 14 }, });