@react_js - страница 656 - Telegram web archive

Anonymous

dangerouslySet и индекс в качестве ключа

Индекс то понятно, uuid для таких вещей, а за dangerouslySet не понимаю

Anonymous

чем лучше?

Eugene

https://github.com/remarkablemark/html-react-parser вот это лучше заюзать

🤔ну хз

Roman

🤔ну хз

а чо нет?

Krits

да индексы бог с ними

Roman

туда можно вклиниться и запретить некоторые теги например

Krits

можно и idx юзать как ключ ниче плохо в этом нет

Paul

https://github.com/remarkablemark/html-react-parser вот это лучше заюзать

хоспаде

Eugene

туда можно вклиниться и запретить некоторые теги например

ну от кейса зависит многое, если это не юзерский html, то можно смело юзать dangerouslySetInnerHTML.

Paul

Щас бы тянуть либу для инжекта хтмл

Eugene

🤔да и валидацию на сервере никто не отменял

Roman

от кейса зависит да

Anonymous

туда можно вклиниться и запретить некоторые теги например

Так за безопасность переживаешь, так много чего можно)

Roman

не ну в доке даже написано что используйте только в крайнем случае

Anonymous

не ну в доке даже написано что используйте только в крайнем случае

Так там написанно про крайний случай или про "туда можно вклиниться и запретить некоторые теги например"?)

Bogdan

Привет всем, подскажите. В useState не могу инпут обработать, value и setValue

Krits

... <div dangerouslySetInnerHTML={{ __html: 'hello <br /> world' }}></div>

да ядолжен не вручную в диве текст с тегом <br /> прописывать, а брать текст из объекта через .map

Roman

Так там написанно про крайний случай или про "туда можно вклиниться и запретить некоторые теги например"?)

ээ чо? про вклиниться это я про парсер писал

Paul

да ядолжен не вручную в диве текст с тегом <br /> прописывать, а брать текст из объекта через .map

Ну бери из объекта

Paul

Какая разница откуда текст, из объекта или вручную

Anonymous

ээ чо? про вклиниться это я про парсер писал

Тогда ты мне так и не ответил, чем твой парсер лучше dangeruslySetInnerHTML?)

Krits

Какая разница откуда текст, из объекта или вручную

Вот так? <div dangerouslySetInnerHTML={{ __html: {text} }}></div>

Anonymous

Зачем мне что-то ставить, если я имею функционал, чтобы получить тот же результат?

Roman

Тогда ты мне так и не ответил, чем твой парсер лучше dangeruslySetInnerHTML?)

ну вот этим и отличается, что парсер можно настроить

Daniil

Привет всем, подскажите. В useState не могу инпут обработать, value и setValue

Подсказываю, покажи код

Anonymous

ну вот этим и отличается, что парсер можно настроить

Но ведь в данный момент задача решена. Ты прям как мой коллега, кучу бы пакетов наставить, а вдруг пригодиться)

Mihail

Привет всем, подскажите. В useState не могу инпут обработать, value и setValue

Делаешь controlled component?

Alexander

<Component1> <Component2>I'm the component</Component2> <h1> Its my component</h1> </Component2> Можно ли как-то в независимости от того, какой порядок в Component1, отображать Component2 всегда последним?

Bogdan

Подсказываю, покажи код

const [value, setValue] = useState() <Input value={value} onChange={setValue} />

Roman

Но ведь в данный момент задача решена. Ты прям как мой коллега, кучу бы пакетов наставить, а вдруг пригодиться)

я просто сильно в начало не листал, если контент не генерируется от юзера, то можно и set делать. но обычно всегда бывает что "да нее там только из файлов", потом "да нее там только админ правит", а потом "ой блин все сломалось" :)

Daniil

const [value, setValue] = useState() <Input value={value} onChange={setValue} />

и что принимает setValue?

Mihail

const [value, setValue] = useState() <Input value={value} onChange={setValue} />

В onchange прилетает ивент

Daniil

)

Mihail

e.target.value тебе надо

Anton

Всем привет, подскажите пжслт, почему выскакивает такая ошибка, когда это функция: export const updateLike = (standupID, answerID) => async dispatch => { try { ... } catch (err) { ... }); } };

Bogdan

и что принимает setValue?

Разве туда ивент не прилмтит?

Mihail

e.target.value тебе надо

onChange={(e) => setValue(e.target.value)}

Bogdan

Я думал прилетит, руками передал таргет валуе

Daniil

прилетит, весь объект

Bogdan

прилетит, весь объект

Увидел

Anonymous

Привет

Mihail

onChange={(e) => setValue(e.target.value)}

Только в отдельный метод вынеси

Krits

... <div dangerouslySetInnerHTML={{ __html: 'hello <br /> world' }}></div>

Все, работает, спасибо тебе добрый человек)

Bogdan

Только в отдельный метод вынеси

Выше компонента?

Mihail

Выше компонента?

Вне return

Vladimir

Всем привет. В классовом компоненте нормально положить что-то в this перменную например: this.isScrolling= true - в onchange скролла Добавлять в стейт - плохо, ведь на каждый скролл у нас будет перерендер компонента. А в функциональном компоненте - ложить через useRef?

Daniil

для таких случаев может поможет useCallback

Dmitriy

для таких случаев может поможет useCallback

Реф же

Vladimir

В другой функции идет проверка на !this.isScrolling

Vladimir

Ага, спасибо

Eugene

System.config({ "paths": { "Core/*": "./app/bundles/core/*" } }); кто-нибудь использовал такое в вебшторм, чтобы алиасы автокомплитились?

Vyacheslav

<Component1> <Component2>I'm the component</Component2> <h1> Its my component</h1> </Component2> Можно ли как-то в независимости от того, какой порядок в Component1, отображать Component2 всегда последним?

Странный кейс, но если надо то можно закостылить flex order-ом

Alexander

Странный кейс, но если надо то можно закостылить flex order-ом

Я подумал на реакт контексте организовать

Vyacheslav

Я подумал на реакт контексте организовать

Не понимаю как связано с контекстом, но можно жсом перебрать детей и положить компоненту 2 в конец отдельно

Alexander

Не понимаю как связано с контекстом, но можно жсом перебрать детей и положить компоненту 2 в конец отдельно

В Component1 в провайдер передается сеттер. В Component2 через него прокидывается содержимое. Component1 отрисовывает его там, где хочет

Dmitriy

<Component1> <Component2>I'm the component</Component2> <h1> Its my component</h1> </Component2> Можно ли как-то в независимости от того, какой порядок в Component1, отображать Component2 всегда последним?

что мешает ручками в конец написать?

Alexander

что мешает ручками в конец написать?

Просто интересный кейс для меня :)

🦜

<Component1> <Component2>I'm the component</Component2> <h1> Its my component</h1> </Component2> Можно ли как-то в независимости от того, какой порядок в Component1, отображать Component2 всегда последним?

Через слоты

Адыл

Через слоты

Я что-то пропустил, или в Реакте есть слоты?

🦜

Я что-то пропустил, или в Реакте есть слоты?

Это обычный паттерн

Alexander

Спасибо за наводку. Поизучаю

Адыл

Это обычный паттерн

А нет, это имитация слотов, просто в пропс пихаешь компоненты

🦜

А нет, это имитация слотов, просто в пропс пихаешь компоненты

🤦‍♂

Адыл

🤦‍♂

Началось...

🦜

Началось...

И закончилось. Я не собираюсь обсуждать реализацию паттерна

Alexander

И закончилось. Я не собираюсь обсуждать реализацию паттерна

Я немного продолжу, не страшно? :) Пока наткнулся на передачу компонента как prop не children. Если глубже изучить паттерн, я смогу найти решение, как его внедрить в children array?

Адыл

Я немного продолжу, не страшно? :) Пока наткнулся на передачу компонента как prop не children. Если глубже изучить паттерн, я смогу найти решение, как его внедрить в children array?

Он имеет ввиду это: https://jeremenichelli.io/2019/02/the-benefits-props-as-component-slots-in-react/

Адыл

Но это не тоже самое, что во Vue

Alexander

Но это не тоже самое, что во Vue

Не знаю реализации во вью. Там, я так понимаю, не односторонее общение компонентов?

Paul

Я что-то пропустил, когда передача реакт ноды в пропсы стало паттерном?

Alexander

Я что-то пропустил, когда передача реакт ноды в пропсы стало паттерном?