<SimpleTabs>
<TabPanel>внутри контент</TabPanel>
</SimpleTabs>
Ты сперва должен как-то описать кол-во табов, написать конфиг например, вот в каком формате ты хочешь описывать? Потом это должно преобразоваться в конечный вариант
GG
GG
Вообщем не понятно, из "чего" во "что" ты хочешь преобразовывать
Anonymous
Так в том и дело что я хочу чтобы количество табов было динамичным. Не хочу строго это прописывать в компоненте.
Anonymous
Главная моя проблема, я хочу чтобы количество компонентов или элементов внтури этого компонента автоматически пробрасывалось в компоненте, и для каждого из них было действие
GG
Оно должно строиться по каким-то усилиями. Опиши в каких случаях сколько пробелов должно быть
Anonymous
как банальный for в js,
GG
Я сдаюсь. Принимайте эстафету
Виктория U
🙁
Anonymous
Опишу вот так - в яваскрипте мы можем найти в разметке количество элементов и пробежать по ним циклом, и к примеру обернуть каждый в элемент. Как так же сделать в реакт?
Anonymous
Это вроде решается через props.children.map, но я не пойму как это работает.
Anonymous
Или можно на вход компоненту принять что то типа {children = [] } = this.props
Виктория U
Увидеть бы твое текущее решение целиком, было бы понятнее
Anonymous
Но опять таки не знаю как это на практике делать
Anonymous
Как бы вы таби реализовали на реакт?
Anonymous
Без варианта когда их количество строго прописано в компоненте
GG
Рендер-пропсы – React
https://ru.reactjs.org/docs/render-props.html
GG
Попробуй это
Anonymous
Рендер-пропсы – React
https://ru.reactjs.org/docs/render-props.html
это используется для данных
Anonymous
Элементы это не данные
Anonymous
Ладно, всем спасибо что питались помочь, буду разбираться.
GG
Ладно, всем спасибо что питались помочь, буду разбираться.
Попробуй с рендер пропсами поиграться, если не поможет, приходи ещё
Anonymous
Хорошо, спс.
Vladislav
Так в том и дело что я хочу чтобы количество табов было динамичным. Не хочу строго это прописывать в компоненте.
Так рендери просто в компоненте детей
Vladislav
export default function TabPanel ({ children }) {
return (<div>{ children }</div>)
}
Vladislav
https://ru.reactjs.org/docs/composition-vs-inheritance.html
Anonymous
Влад, спасибо, вот ты то что надо показываешь, но вот мой TabPanel он вызывается уже внутри рендера. Мне надо что-то типа, ComponentTabs внутри TabPanel и внутри еще контент. Рендер внтури ренда делать же нельзя.
И еще проблема в том, что все примеры в интернете показаны с компонентами классами, а у меня проект с функциональными компонентами и хуками, я с ними вообще жесть как туплю, с классами полегче все и попонятней
Vladislav
Влад, спасибо, вот ты то что надо показываешь, но вот мой TabPanel он вызывается уже внутри рендера. Мне надо что-то типа, ComponentTabs внутри TabPanel и внутри еще контент. Рендер внтури ренда делать же нельзя.
И еще проблема в том, что все примеры в интернете показаны с компонентами классами, а у меня проект с функциональными компонентами и хуками, я с ними вообще жесть как туплю, с классами полегче все и попонятней
С чего ты взял что рендер внутри рендера - это плохая штука?
Vladislav
На этом реакт держится
Виктория U
Обожаю классы
Anonymous
Виктория спасибо.
Anonymous
Влад, если с классами я могу писать рендер внутри рендера, то с функциями я могу писать ретурн внутри ретурна и ничего не развалиться?
Anonymous
Типа return (
внутри еще Return (
)
)
Vladislav
А, ты об этом
Anonymous
Да об этом
Vladislav
Так работать не будет
Anonymous
Я знаю что не будет, как это обойти
Romuald
Anonymous
Это понятно, просто вызывать компоненты) Блин меня уже самого запутали)
Anonymous
Влад спасибо
Anonymous
Ладно, всем спасибо, буду разбираться.
От
всем привет
Anonymous
Vladislav
От
Как отследить пользователей телеграмм бота?
Славик
узнать, где они живут?
Andriy
скиньте тг канал по css
Kenan
скиньте тг канал по css
MaxGraey
Как сервисы типа OneTravel дурят нас форсирую быстрее совершать покупку) Javascript детективная история прямо. Очень забавно:
https://twitter.com/OphirHarpaz/status/1184486445039411201
Orzue
Привет всем.
Как сравнить два объекта на js правильно?
A
что именно сравнить надо
MaxGraey
Привет всем.
Как сравнить два объекта на js правильно?
для простых типов (строки числа) достаточно shallow equal то есть Object.is(a, b) но нужно быть аккуртнее старые браузеры могут не поддерживать. Позволяет сравнисать NaN и NaN и jnbxfnm +0 от -0.
Для объектов лучше все же наверное (deep equal). В lodash есть такой
_.isEqual(a, b)
Виктория U
функциональная либа на js
Карамультук
Привет всем.
Как сравнить два объекта на js правильно?
Не могу не упомянуть непреложную истину, что если у тебя возникла необходимость сравнивать объекты, то скорее всего что-то идет не так
Igor
старый добрый JSON.stringify правда с некоторыми ограничениями
MaxGraey
функциональная
только lodash/fp более не менее функциональная, все остальное - это императивщина
Карамультук
⁉
сравнение объектов как правило дорогостоящая операция и нужно в очень редких случаях, не могу даже привести корректный пример когда оно необходимо
Dmytro
Добрый день, подскажите пожалуйста,
Как в вебпак настроить точку монтирования CSS, если все билдится в один main.js , а внутри вебкомпонента есть shadow dom?
Arsen
так а что их сравнивать обєкты равны только если ето один и тот же обэкт
MaxGraey
MaxGraey
Если не пользоваться тестовыми фреймфорками например, где это уже есть
MaxGraey
сравнение объектов как правило дорогостоящая операция и нужно в очень редких случаях, не могу даже привести корректный пример когда оно необходимо
MaxGraey
7 млн загрузок в неделю с тобой не согласны)
Карамультук
7 млн загрузок в неделю с тобой не согласны)
и в результате мы жалуемся на тормозной фронтенд повсюду)
MaxGraey
и в результате мы жалуемся на тормозной фронтенд повсюду)
@google-cloud/firestore (google)
react-vis (uber)
redux-router
redux-react-router
@jetbrains/ring-ui (jetbrains)
react-mapbox-gl (mapbox)
Вот лишь небольшой список пакетов что пользуются им (непосредственно зависят от deep-equal, то есть явно не для тестов язают). Я бы не сказал что те ребята делают "тормознутый" фронтенд как ты выразился
Виктория U
и в результате мы жалуемся на тормозной фронтенд повсюду)
Просто не нужно вызывать эту функцию на каждый чих