React — русскоговорящее с...
Android Developers
Python
Vue.js — русскоговорящее ...
supapro.cxx
DotNetRuChat
GNU/Linux Help
Telegram Developers
Node.js — русскоговорящее...
DevOps — русскоговорящее ...
JavaScript Noobs — сообще...
![Django [ru]](https://image.telq.org/channel_avatar_1063854692_12437233608009742_mini.jpeg){kind=avatar}
Django [ru]
Go-go!
Angular - русскоговорящее...
ntwrk
Верстка сайтов HTML/CSS/J...
phpGeeks
Kubernetes — русскоговоря...
Битрикс для разработчиков
MODX. Русскоязычное сообщ...
pgsql – PostgreSQL
Laravel Pro
iOS Developers — русского...
ClickHouse не тормозит
Rust — русскоговорящее со...
JavaScript — русскоговоря...
С#
pro.cxx
pro.jvm
React Native — русскогово...
Devs Chat
Docker — русскоговорящее ...
HTML/CSS — русскоговоряще...
Python beginners
🐧 RU.UBUNTU — Официальное...
Kotlin Community
Embedded Group
Чат экстремального погром...
aiogram
Scala User Group
Haskell
PHP
TypeScript
Клуб Vue.js-разработчиков
Xamarin Developers (MAUI,...
F# Chat
![Svelte [svelt] - All abou...](https://image.telq.org/channel_avatar_1142273288_5399907573915831550_mini.jpeg){kind=avatar}
Svelte [svelt] - All abou...
Системное администрирован...
Nuxt.js | Vue SSR
var chat = new Chat();
Data Science Chat
Android Architecture
Laravel для начинающих
Ассемблер
Церковь метрик
Dart & Flutter
QA — русскоговорящее сооб...
Tarantool
pro.elixir
Python Flask
SAP ABAP
R (язык программирования)
learn.java
Big Data Science :: AI / ...
DevsHelper
SwiftBook
Solidity Development
pro.net (former COM+)
OpenStreetMap RU
Visual Studio Code — русс...
Delphi & Lazarus
ru_mysql
pro.lua
GraphQL — русскоговорящее...
Dart / Flutter
Evolution CMS развитие и ...
pro.Asm
OpenCartForum - 🇺🇦🇪🇺Чат O...
Angular.js (1.x) — русско...
IDE и редакторы — русског...
Frontend_ru
Flutter Developers — русс...
AutoIT RU
AI / Искусственный Интелл...
Lame C
Laravel Framework Russian...
WebPwnChat
Чат — Верстка Сайтов и Фр...
pro.python
Java Underground
dlang.ru
Natural Language Processi...
javascript_ru
SqlCom.ru - сообщество MS...
Cinema 4D
pro.vim
PHP DevConf KZ🇰🇿
Delphi Community
Autohotkey_RU ( v1 & v2 )
pro.rb (Ruby/Rails / RU)
RubyRush.ru
Server Side Swift Develop...
Oracle RU
DevOps
Software Design/Architect...
sql_ninja
Odoo talks & fun
AndroidDev Pro:: Професси...
WordPress for developers
PowerShellRus - о Powersh...
ru.nim.talks
Эльбрусы и с чем их едят
Java/Kotlin and more
Modern::Perl
pro.buildsystems
Powershell Rus
Haskell Start
Python для анализа данных
Скрипты Гугл, Таблицы, Go...
WebGL ru
Compiler Development
firebase_ru — русскоговор...
phpclub.ru
ErlangRus
RU.CRYPTOGRAPHY — Криптог...
QA juniors
GameDev for Web
Electron.js
MySQL (EN)
Go Get A Job
Lame C++
pro.osdev - os developmen...
RU.Docker — Официальное Р...
Emacs — русскоговорящее с...
PostgreSQL (English)
Ember_js
FreePascal & Lazarus
Django
Tilda Developers
WordPress – русскоговорящ...
Язык программирования Jul...
ReasonML и OCaml
sentry_ru
ansible — русскоговорящее...
WebAssembly — русскоговор...
Сrystal Lang — русскогово...
aiohttp
Clojure — русскоговорящее...
heroku_ru
PowerShell Pro
systemd
macOS Developers — русско...
use Perl or die;
FORTH и родственные ЯП
ru_jenkins
Natural Language Processi...
CatBoost
CyberBiology
Sequelize - community (en...
sonarqube_ru
Elm Lang сообщество разра...
SublimeText_RU
NativeScript
WordPress CodeRun
ReactiveX - русскоговорящ...
PureScript — русскоговоря...
#Вайти
Эликсир и Вунш
Cassandra
По сути это 2 разных скрина или нет?
3 ответов
const allElement = { id: 'All', title: 'All', }; const TabFilter: React.FC<TabFilterProps> = memo(({ data, onChange, isNeedAll }) => { const [itemsList, setItemsList] = useState(data); const [selectItem, setSelectItem] = useState(isNeedAll ? allElement.id : data[0].id); useEffect(() => { if (isNeedAll && data) { const newData = [allElement, ...data]; setItemsList(newData); } }, [isNeedAll, data]); const Item: React.FC<ItemProps> = memo(({ item }) => { const isselectId = selectItem === item.id; const selectHandler = useCallback(() => { setSelectItem(item.id); onChange(item.id); }, [item.id]); return ( <TouchableOpacity style={styles.item} onPress={selectHandler}> <View style={styles.itemContainer}> <Text size="middle" type="medium" style={{ ...styles.selectText, color: isselectId ? COLORS.primary : COLORS.lightGray, }} numberOfLines={1} > {item.title} </Text> {item.num ? ( <View style={styles.numContainer}> <Text style={styles.number} numberOfLines={1} ellipsizeMode="tail"> {item.num} </Text> </View> ) : null} </View> <View style={{ ...styles.underline, backgroundColor: isselectId ? COLORS.backgroundDark : COLORS.white, }} /> </TouchableOpacity> ); }); return ( <View style={styles.container}> <FlatList data={itemsList} showsHorizontalScrollIndicator={false} // eslint-disable-next-line react-perf/jsx-no-new-function-as-prop keyExtractor={item => item.id} // eslint-disable-next-line react-perf/jsx-no-new-function-as-prop renderItem={({ item }) => <Item item={item} />} horizontal contentContainerStyle={styles.scrollContainer} /> </View> ); });
const allElement = { id: 'All', title: 'All', ...
Зачем? это же просто навигация
Зачем? это же просто навигация
Нам она не подошла, пришлось писать самому
Похожие вопросы
Обсуждают сегодня