A
господа, это норма для material-ui? <td class="MuiTableCell-root MuiTableCell-body MuiTableCell-alignLeft WithStyles(ForwardRef(TableCell))-root-241 WithStyles(ForwardRef(TableCell))-root-277 Styled(WithStyles(ForwardRef(TableCell)))-root-240 add">
Eugene
Кто сталкивался с тем, что серверу нужно прислать разметку? Какие есть популярные структуры для этого? Например, у нас есть место, где сервер присылает некое "описание" сущности, которое содержит гиперссылку. Я вижу такие варианты решений: 1) (самый нерекомендуемый, озвучиваю для галочки) Сервер шлёт html текст, на клиенте он вставляется через innerHTML 2) Сервер шлёт какой-то особый формат, о котором договорились заранее. Например, сервис google pagespeed шлёт ответ примерно в таком виде: { args: [ { type: 'HYPERLINK', value: 'https://google.com', text: 'this link' } ], format: "Follow $1 for more details", } 3) Сервер шлёт маркдаун, на клиенте парсится с помощью какой-либо маркдаун-либы 4) Сервер шлёт html текст, на клиенте используется библиотека для html-парсинга с вайтлистом тэгов Важные моменты: Строить разметку на клиенте желательно не только из соображений безопасности, но так же из-за удобства: для рендера тех же ссылок клиент должен использовать свой компонент <Link />, а не обычный <a />. При innerHTML эта возможность теряется.
Хм, можно еще глянуть как draft.js парсит такое У них же там свой формат какой-то, мб в сторону его глянуть
Eugene
https://draftjs.org/docs/api-reference-data-conversion 🤔
Daniil
можно ли как-то из styled-components вытащить стили с названиями, соответствующими назавнияи компонентов?
Daniil
т.е есть displayName, на вёрстке - ок, но там в конце ещё рандомный guid
Daniil
написать свой плагин?
Andrei
Я искал такой способ и не нашел)
Andrei
Понял, что это не нужно Зачем тебе такое
Andrei
Запусти туда id какой-нибудь, реф используй
Andrei
Ещё что-нибудь
Daniil
такая ситуация, что sc генерят айдишники каждый раз разные при деплое
Daniil
есть сторона контент-менеджеров, они хотят их использзоать прям в пхп
Daniil
вообще независимо от нас (фронтедеров)
Daniil
как им сгенерить более адекватный имена классов
Андрей
Привет) подскажите как в спешлКомпонент передать value из категориПрайс?
Daniil
@AndreyBerezhnoy , ткни плиз носом, что за плагин? ты про babel-styled-components
Андрей
ну наверна <specialComponent value={value}/>
наверное я не уточнид, этот компонент не вызыается в прайсе. ТО есть они независимы
Victor
не уточнил )) ну, значит надо найти что то общее.. может родитель один?
Андрей
как-то можно придумать чтобы туда передать?
Victor
Так не бывает )) Как минимум root элемент общий )))
Victor
Или это разные ReactApp?
Андрей
Или это разные ReactApp?
я не уверен что вобще -то что я сделал это адекватно) суть в том что спешл это чисто отобразить в прайсе есть таблица. в ней есть обьект с ключами (по ним беруться данные) вот в этот обьект с ключами я передаю свой спешл, чтобы отобразить чекбоксы с данными
Андрей
стор, контекст
useContext подойдет ?
Victor
https://codesandbox.io/embed/send-value-to-sibling-wb66w
Victor
это я знаю
так разве это не решение задачи? Если не нравится перспектива пробрасывать скзвозь все приложение пропсы, можно Context заюзать
A
Ты в курсе что есть либа для реакта?
какая либа? вот эта - https://material-ui.com/ ?
A
так она мне и выплёвывает бесполезные классы, что в две строки не вмещаются
A
при использовании синтаксиса styled-components
A
я про неё и спрашиваю
Cenator 🐈
В проде так же?
Cenator 🐈
И вообще длина классов не влияет на перфоманс, были тесты
Victor
окей, спасибо)
во примерчик с контекстом https://codesandbox.io/s/2xm24n2l9y
Mikhail
И вообще длина классов не влияет на перфоманс, были тесты
как это не влияет?! чем длиннее имя класса, тем дольше его парсить
Vadim
как это не влияет?! чем длиннее имя класса, тем дольше его парсить
есть тесты, которые доказывают, что на это можно забить
A
В проде так же?
cори, в проде норм
Vladislav
Я не понимаю что за приколы. Кей присваивается, но все равно выплевывает ошибку что нет ключа
Mikhail
есть тесты, которые доказывают, что на это можно забить
ну как бы оно на уровне погрешности, но нельзя говорить, что раницы нет
Mikhail
+-килобайт кода всем пофиг
Vadim
ну как бы оно на уровне погрешности, но нельзя говорить, что раницы нет
ясен фиг, что есть разница. Она настолько ничтожна, что нет смысла на этом заострять внимание.
Vladislav
Victor
а код ToDoList?
Vladislav
Да, это тудулист
Misha
?
Покажи код где ты кей присваиваешь
Victor
покажи в смысле )
Vladislav
Andrey
так тебе тогда key нужно на фрагмент вешать
Victor
https://reactjs.org/docs/fragments.html#keyed-fragments
Victor
Vladislav
Да, точно, спасибо
Victor
мы как то лулзов схватили, когда пытались на фрагмент onClick повесить )) долго искали почему не работает. Документацию читать - последнее что приходит в голову )))
Anton
Вопрос: как лучше хэндлить socket.on в редаксе создавать экшены или просто создать файл и там на сокет навесить socket.on миллион штук и импортить оттуда сокет?
Alina
Имхо, все равно в список добавлять li и рядом кнопку не корректно вообще
Vladislav
Тогда и фрагменты не нужны
Krits
Подскажите как сгенерировать массив через for? c такими объектами где их 10 штук например buttons: [ {id: 1, red: false, green: false} ]
Victor
new Array(10)
Krits
new Array(10)
а по конкретнее можно?
Victor
а по конкретнее можно?
https://codesandbox.io/s/render-1000-of-numbers-mg1vs
Vladislav
let arr = new Array(10).fill({red: false, green: false})
Vladislav
Или если нужен динамический ид, то через мапу