Подскажите, как мне «правильно» прокинуть реф на реактовский компонент, что

Question

Подскажите, как мне «правильно» прокинуть реф на реактовский компонент, что

бы скопировать его совершенно в другом месте.
Как сейчас это выглядит:
Элемент который я хочу контролировать и навешивать события по его рефу, и при определнном событии копировать его (функциональный компонент) и монтировать на другом элементе. Что я сделал:

SourceElement = () => {
const { setRef } = useSource();
return <div ref={setRef}>…</div>
}
useSource = () => {
const origRef = useRef(null);
const setRef = useCallback((node) => origRef.current = node, []);
}

далее в useSource я навешиваю события на ДОМ элемент и все супер, но! Мне я хочу копировать этот реакт компонент и не много модернизировать его через cloneElement в отдельно контексте, не могу понять найти правильное решение, в функции setRef достаточно будет указывать полученную ноду для контекста и при получении ссылки клонировать в другой компонент?

#frontend #javascript #programming #react.js #russian

0

20.08.2022

6 ответов

23 просмотра

Valentin Автор вопроса

прост при попытке копирнуть компонент по полученной ссылки получаю такую ошибку.. возможно при работе с функциональными компонентами только форвард реф использоватть?

0

20.08.2022

Valentin Автор вопроса

Valentin
прост при попытке копирнуть компонент по полученно...

у кого есть время и желание разобраться в этом уг? за денюжку в лс?

0

20.08.2022

Dmitriy Shuleshov

а точно ли нужны такие сложности? что за задача вцелом?

0

20.08.2022

Valentin Автор вопроса

Dmitriy Shuleshov
а точно ли нужны такие сложности? что за задача вц...

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

0

20.08.2022

Valentin Автор вопроса

Dmitriy Shuleshov
а точно ли нужны такие сложности? что за задача вц...

задача интересная, есть два отдельных блока, один из них с безграничным скролом по двум осям, там есть куча элементов и мне нужно реализовать драг-дроп с кучей условий, например направление движения и при перемещении обращаться к беку узнавать можно ли разместит, показывать это на элементах размерщения, а так же на элементе коорый таскаем + бонусом (и в этом я почему то начал усложнять) элемент который перетаскиваем должен оставаться на месте… да к тому же если я буду оригинальный элемент двигать, не смогу его перемещать между разными областями, поэтотму создаю слой поверх этих областей, и по нему уже тащу элемент

0

20.08.2022

Veli · Accepted Answer

Не совсем понимаю, что вы хотели добиться этим кодом - в планировали в другом месте приложения вызвать useSource и получить его состояние, записанное в другом месте при другом вызове useSource? Это невозможно, каждый вызов хука полностью новый и никак с предыдущими не связан Конкретно по вашей проблеме, думаю, может помочь Portal. Посмотрите в эту сторону

169 похожих чатов

Подскажите, как мне «правильно» прокинуть реф на реактовский компонент, что

6 ответов

Похожие вопросы